portfolio
portfolio copied to clipboard
aamahi
It's a 3D developer portfolio website built using React.js, Three.js, and React Three Fiber.
3D Developer Portfolio
📋 Table of Contents
- 🤖 Introduction
- ⚙️ Tech Stack
- 🔋 Features
- 🤸 How To Run
🤖 Introduction
⚙️ Tech Stack
- React.js
- Three.js
- React Three Fiber
- React Three Drei
- Email JS
- Vite
- Tailwind CSS
🔋 Features
👉 Customizable 3D Hero Section: Includes a 3D desktop model easily customizable to suit specific needs.
👉 Interactive Experience and Work Sections: Utilizes animations powered by framer motion for engaging user experience.
👉 3D Skills Section: Showcases skills using 3D geometries through three.js and React Three fiber
👉 Animated Projects and Testimonials: Features animated sections using framer motion for projects and client testimonials.
👉 Contact Section with 3D Earth Model:Integrates a 3D earth model with email functionality powered by emailjs.
👉 3D Stars: Generate stars progressively at random positions using Three.js for background display.
👉 Consistent Animations: Implements cohesive animations throughout the website using framer motion.
👉 Responsive Design: Ensures optimal display and functionality across all devices.
and many more, including code architecture and reusability
🤸 How to Run
Follow these steps to set up the project locally on your machine.
Prerequisites
Make sure you have the following installed on your machine:
Cloning the Repository
git clone [email protected]:aamahi/portfolio.git
cd portfolio
Installation
Install the project dependencies using npm:
npm install
Set Up Environment Variables
Create a new file named .env in the root of your project and add the following content:
REACT_APP_EMAILJS_USERID=your_emailjs_user_id
REACT_APP_EMAILJS_TEMPLATEID=your_emailjs_template_id
REACT_APP_EMAILJS_RECEIVERID=your_emailjs_receiver_id
Replace the placeholder values with your actual EmailJS credentials. You can obtain these credentials by signing up on the EmailJS website.
Running the Project
npm run dev
Open http://localhost:5173 in your browser to view the project.
aamahi