Welcome to the repository for a cutting-edge personal website template. This project serves as a modern, responsive, and interactive web portfolio template for anyone looking to showcase their experience, skills, and projects. Developed using React, Three.js, and modern web technologies, it aims to provide a seamless user experience with an immersive 3D interface across all devices.
- DynamicBackground.js: Presents a fluid, interactive particle system (representing data nodes) that reacts to mouse movement.
- HolographicCard.js: Centralized 3D holographic card displaying user information. Reacts to user interaction, rotating and reflecting light dynamically.
- DarkModeToggle.js: Easily toggle between light and dark modes, ensuring a comfortable browsing experience.
- Homepage.js: Serves as the main landing page, integrating the DynamicBackground and HolographicCard among other features.
- AboutMe.js: Presents information about the user, complete with a Timeline.js for showcasing the user's journey.
- TechStack.js: Animated icons representing various technologies the user is proficient in.
- Projects.js: A showcase of user projects. ProjectModel.js represents each project as a 3D model on a virtual desk. ProjectDetail.js offers a deeper look into each project.
- ContactForm.js: Allows visitors to send messages or inquiries directly from the website.
- Navigation.js: Minimalistic icons that expand upon hovering, aiding in navigation throughout the site.
- Header.js and Footer.js: Structured top and bottom sections for consistent navigation and additional information.
- DownloadResume.js: Provides visitors with a downloadable resume or CV.
With the help of Three.js, this template integrates 3D models and animations, especially in the ProjectModel.js component, providing an engaging experience for visitors.
- Node.js and npm installed.
- Clone this repository:
git clone https://github.com/your_username/personal-website-template.git
- Navigate to the project directory
cd personal-website-template
- Install the required dependencies:
npm install
- Start the development server:
npm start
- Open your browser and navigate to 'http://localhost:3000'. The website template should be running!
- Fork or clone this repository.
- Follow the installation steps mentioned above.
- Modify the data in the source files to reflect your own information, skills, projects, etc.
- Expand upon the basic structure, adding interactive features, animations, or any other enhancements you desire.
- Deploy to your preferred hosting platform.
Contributions are welcome! If you find a bug or have suggestions, feel free to open an issue or submit a pull request.
This project is open-source and available under the MIT License.