This project showcases a 3D model of a triple bed bunk design using React Three Fiber, Vite, and TypeScript. The application provides an interactive experience where users can view and explore the bunk bed design in a 3D space.
You can view the live version of the project at https://irebah.github.io/triple-bed-bunk-design.
- Interactive 3D visualization of a triple bed bunk
- When clicking on a specific timber all the timbers of the same size (width, height and depth) will highlight
- Smooth rendering and animations with React Three Fiber
- Lightweight and fast development environment using Vite
- TypeScript for type safety and improved developer experience
- React Three Fiber: A React renderer for Three.js, enabling easy 3D graphics in React applications.
- Vite: A fast build tool that provides an optimal development environment.
- TypeScript: A superset of JavaScript that offers static typing for better code quality.
- pnpm: A fast, disk space-efficient package manager.
To set up the project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/irebah/triple-bed-bunk-design.git cd triple-bed-bunk-design
-
Install dependencies:
pnpm install
-
Run the development server:
pnpm dev
-
Open your browser: Navigate to http://localhost:5173 to view the application.
Use your mouse or touch gestures to rotate, zoom, and pan the 3D model of the triple bed bunk.
Explore different angles and perspectives to better understand the design.
Enjoy!!
This project is licensed under the MIT License. See the LICENSE file for details.