/ThreeFiberSimpleRoom

🏠 A simple room created using Three.js and Next.js with the ThreeFiber library. You can use this project as a starting point to build and experiment with your own 3D environments.

Primary LanguageJavaScript

🏠 ThreeFiberSimpleRoom

Welcome to ThreeFiberSimpleRoom, a simple room created with Three.js and Next.js using the ThreeFiber library.

Room Image

Getting Started

To get started with the development server, follow these steps:

  1. Clone the repository:

    git clone https://github.com/ViniciusCestarii/ThreeFiberSimpleRoom.git

  2. Navigate to the project directory:

    cd ThreeFiberSimpleRoom

  3. Install dependencies:

    npm install
# or
yarn
# or
pnpm install

  4. Run the development server:

    npm run dev
# or
yarn dev
# or
pnpm dev

  5. Open http://localhost:3000 with your browser to see the result.

Features

  • Three.js: Utilizes the power of Three.js, a popular JavaScript library for creating 3D graphics in the browser.

  • ThreeFiber: Integrates ThreeFiber, a React renderer for Three.js, making it easy to create interactive and dynamic 3D scenes with React components.

Project Structure

  • /app: Next.js pages directory.

  • /components: React components for the Three.js room, and other elements.

  • /public: Static assets like images and models.

Customize and Extend

Feel free to customize the room, add new elements, or experiment with different Three.js features. The project structure is designed to be easily extendable.

Resources