A 3D Dev Portfolio

📋 Table of Contents

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

🤖 Introduction

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.

⚙️ Tech Stack

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

🔋 Features

👉 Immersive Hero: An eye-catching 3D room that responds to mouse movements.

👉 Advanced Color Picker: Tailor your T-shirt’s hue to match your style or mood with precision, and see your color choices instantly reflected on the 3D model.

👉 Flexible File Upload & Design Options: Personalize your T-shirt by uploading your own images with ease. Choose whether to feature your artwork as a prominent logo or to cover the entire shirt with your design.

👉 Interactive 3D T-Shirt Model: Experience real-time visual feedback as you customize your T-shirt; the model intuitively responds to your mouse movements, allowing you to see every angle and detail of your creation.

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

and many more, including code architecture and reusability

🤸 Quick Start

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/aroradev1010/TeeCraft.git
cd threejscc-portfolio

Installation

Install the project dependencies using npm:

npm install

Running the Project

npm run dev

Open http://localhost:5173 in your browser to view the project.