A modern, minimalist portfolio website built with React, Three.js, and Tailwind CSS. Features a 3D model integration, smooth animations, and a responsive design.
- Modern Design: Clean, minimalist black and white theme
- 3D Integration: Interactive 3D model using Three.js and React Three Fiber
- Responsive: Fully responsive design that works on all devices
- Animations: Smooth page transitions and hover effects using Framer Motion
- Performance: Optimized for fast loading and smooth interactions
- Projects Showcase: Clean grid layout for featuring projects
- Contact Form: Easy to use contact section
- React - Frontend framework
- Vite - Build tool
- Three.js - 3D graphics
- React Three Fiber - React renderer for Three.js
- Framer Motion - Animation library
- Tailwind CSS - CSS framework
myportfolio/
├── public/
│ ├── assets/ # Images and static assets
│ │ ├── models/ # 3D models
│ │ └── textures/ # Textures for 3D models
│ ├── src/
│ │ ├── components/ # React components
│ │ │ ├── layout/ # Layout components
│ │ │ ├── sections/# Page sections
│ │ │ └── ui/ # Reusable UI components
│ │ ├── constants/ # Constants and data
│ │ ├── App.jsx # Main app component
│ │ └── index.css # Global styles
│ ├── README.md # This file
│ └── package.json # Project dependencies
-
Clone the repository
git clone https://github.com/yourusername/portfolio.git
-
Install dependencies
npm install
-
Start development server
npm run dev
-
Build for production
npm run build
- Mobile-first approach
- Breakpoints:
- Mobile: < 640px
- Tablet: 640px - 1024px
- Desktop: > 1024px
- Add blog section
- Implement dark/light theme toggle
- Add more interactive 3D elements
- Integrate a CMS for easier content updates
- Add more project filters and categories
This project is licensed under the MIT License - see the LICENSE file for details.
Hugo - [Your Email] Project Link: [Your Repository URL]