Welcome to the React Three.js Multi-Window Project! This project combines the power of React, Three.js, and a custom WindowManager that uses localStorage to create an engaging and interactive multi-window experience.
This project serves as a showcase for utilizing Three.js within a React application to render 3D graphics and manage multiple windows seamlessly. The WindowManager component facilitates the creation, synchronization, and manipulation of these windows, providing a dynamic and immersive user experience.
Make sure you have the following installed:
Follow these steps to set up and run the project on your local machine.
- Clone this repository:
git clone https://github.com/ritikbanger/react-multi-window/
- Navigate to the project directory:
cd react-multi-window
- Install the dependencies:
npm install
- Run the project:
npm start
- Open multiple windows of
localhost:3000
in incognito/private mode and overlap them!
src/ |-- components/ | |-- Main.js | |-- WindowManager.js |-- App.js |-- index.js
Harness the capabilities of Three.js for creating stunning 3D shapes and graphics. Leverage the library's robust features to bring your creative ideas to life.
Utilize the custom WindowManager component to efficiently manage, synchronize, and manipulate multiple windows. Enjoy a dynamic and immersive user interface with seamless window interactions.
We welcome contributions to enhance and improve this project. Feel free to create issues, submit pull requests, or provide feedback to make this project even better.
-
The Three.js team for their comprehensive 3D library.
-
The project is created by inspiration from the tweet by Bjørn Staal
This project is open-sourced under the MIT License - see the LICENSE.md file for details.