A modern, animated 3D developer portfolio built with React, Three.js, TailwindCSS, and motion effects β designed to help you stand out and showcase your skills creatively.
![3d Portfolio Screenshot GitHub]
- Features
- Tech Stack
- Project Structure
- Getting Started
- Assets
- Contact Me
- Suggestions or Feedback
- Like This Project?
- π₯ 3D visuals powered by React Three Fiber and Drei
- β‘ Smooth transitions and scroll-based animations using Framer Motion
- π¨ Clean, responsive UI with TailwindCSS
- π Working contact form using EmailJS
- π§± Beautiful UI enhancements with Aceternity UI and Magic UI
- π Lightning-fast development with Vite
| Tech | Description |
|---|---|
| React | Front-end JavaScript library |
| Vite | Fast bundler and dev environment |
| TailwindCSS | Utility-first CSS framework |
| React Three Fiber | 3D rendering with Three.js in React |
| Drei | Helpers and abstractions for R3F |
| Framer Motion | Animation library for React |
| EmailJS | Form handling and email integration |
| Aceternity UI | Custom UI components |
| Magic UI | Prebuilt UI elements and design extras |
βββ public/
β βββ assets/ # Images, textures, models
β βββ models/ # 3D Astronaut model
β βββ vite.svg
βββ src/
β βββ components/ # Reusable components
β βββ constants/ # Reusable datas
β βββ sections/ # Portfolio sections (Hero, About, etc.)
β βββ App.jsx # Main app file
β βββ index.css # Tailwind css
β βββ main.jsx # Entry point
βββ tailwind.config.js
βββ vite.config.js- Clone the Repository
git clone https://github.com/Ali-Sanati/Portfolio.git
cd Portfolio- Install Dependencies
npm install- Run the Development Server
npm run devThe app will be available at http://localhost:5173.
Assets used in the project can be found here