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.
- Interactive 3D Landing Page: Includes a
HackerRoomGLB model (1.4 MB, Draco-compressed) with additional 3D elements like a spinning cube, rings, and React logo. - Responsive Design: Adapts to various screen sizes (mobile, tablet, desktop) using media queries and dynamic sizing.
- Performance Optimized: Mobile-friendly with Draco compression, reduced DPR, and lightweight rendering settings.
- Tech Stack: React.js, Three.js,
@react-three/fiber,@react-three/drei, and Tailwind CSS.
Live Demo
Note: On mobile, expect a 1-2 second load time depending on network speed due to the 3D assets.
- Node.js: Version 16 or higher recommended for compatibility with dependencies.
- npm or Yarn: Package manager to install project dependencies (npm comes with Node.js).
- Modern Browser: Chrome, Firefox, or Edge with WebGL support for rendering 3D content.
- Git: To clone the repository from GitHub.
- Optional:
gltf-transformCLI (npm install -g @gltf-transform/cli) if you want to recompress or modify the GLB file.
- Clone the Repository:
git clone https://github.com/your-username/your-repo-name.git cd your-repo-name