Anneshu's Portfolio

1. 🤖 Introduction
2. ⚙️ Tech Stack
3. 🔋 Features
4. 🤸 Quick Start
5. 🔗 Links

Built with React.js for handling the user interface, Three.js for rendering 3D elements, and styled with TailwindCSS, the 3D Minimalistic portfolio is a website project. The primary goal is to demonstrate the developer's skills in a unique manner that creates a lasting impact.

• Node.js
• React.js
• Three.js
• React Three Fiber
• React Three Drei
• Email JS
• Vite
• Tailwind CSS

👉 Immersive Hero: An eye-catching 3D hacker room that responds to mouse movements, surrounded by animated mini-models.

👉 Interactive About Me: A sleek bento grid layout featuring personal info, a 3D globe pinpointing location, tech stack icons, and a one-click email copy option.

👉 Dynamic Project Showcase: Browse through projects while watching live demos inside a 3D computer model, seamlessly switching between different projects.

👉 Engaging Experience Timeline: Hover over career milestones to trigger interactive 3D animations that bring your professional journey to life.

👉 Client Testimonials: A dedicated section highlighting satisfied clients and their feedback.

👉 Easy Contact Form: A user-friendly email form for visitors to reach out directly from your portfolio.

👉 Clean Footer: A minimalist design featuring social media links for easy networking.

👉 Fully Responsive: Optimized layout ensuring a smooth experience across all devices, from desktop to mobile.

👉 Magic Cursor: A intuitive magic cursor that adds a sense of excitement to the user as he/she moves the cursor.

and many more, including code architecture and reusability

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have the following installed on your machine:

• Git
• Node.js
• npm (Node Package Manager)

Cloning the Repository

git clone https://github.com/NK-Works/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:

VITE_APP_EMAILJS_SERVICE_ID=your_emailjs_service_id
REACT_APP_EMAILJS_TEMPLATEID=your_emailjs_template_id
VITE_APP_EMAILJS_PUBLIC_KEY=your_emailjs_public_key

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.

Here is the list of all the resources used in the project video:

• Hacker Room
• Computer
• Target Model
• React Logo
• gltfjsx
• ReadyPlayerMe
• Mixamo

Consider 🌟 the repository to show some love 🙏