3D Room using React, Vite, Three.js, and Tailwind CSS

🚀 Project Overview

This project is a 3D room built using React, Vite, Three.js, and Tailwind CSS. It provides an interactive 3D environment where users can navigate and explore a virtual room with custom objects, lighting, and animations.

🔧 Technologies Used

• React - JavaScript library for building user interfaces
• Vite - Fast build tool for modern web applications
• Three.js - JavaScript library for creating 3D graphics in the browser
• Tailwind CSS - Utility-first CSS framework for styling

📂 Project Structure

3d-room-project/
│── public/
│── src/
│   ├── components/
│   │   ├── Room.jsx
│   │   ├── Lights.jsx
│   │   ├── Controls.jsx
│   ├── assets/
│   ├── App.jsx
│   ├── main.jsx
│── package.json
│── tailwind.config.js
│── vite.config.js
│── README.md

🛠 Installation & Setup

1. Clone the repository

   git clone https://github.com/euii-ii/3d-room-pt-2.git
   cd 3d-room
   

2. Install dependencies

   npm install
   

3. Start the development server

   npm run dev
   

4. Open in browser

   • Navigate to http://localhost:5173/

🎨 Features

• Interactive 3D Room
• Lighting and Shadows
• Object Animations
• Camera Controls (OrbitControls)
• Responsive Design with Tailwind CSS

✨ Usage

Modify the Room.jsx file to customize the room objects, lighting, and animations. Adjust styles in tailwind.config.js as needed.

🛠 Build for Production

To create a production-ready build, run:

npm run build

📜 License

This project is licensed under the MIT License.