This Next.js project showcasing THREE.js integration draws inspiration from an existing example found at this codesandbox. While the core concept remains, I've adapted the original JavaScript code into TypeScript and refactored it to enhance modularity through code splitting. By leveraging the flexibility of TypeScript and Next.js, the project provides a structured and efficient approach to incorporating THREE.js functionalities within a Next.js application.
- Demonstrates the integration of Three.js in a Next.js app router application.
- Extends geometry and material to create custom THREE elements with typescript support.
You can view a live demo of this project here.
This project relies on the following dependencies:
- next (v14)
- @react-three/drei
- @react-three/fiber
- three
- typescript
- tailwind
Contributions are welcome! If you'd like to contribute to this project, please follow these steps:
- Fork this repository.
- Create a new branch for your feature or bug fix.
- Make your changes and commit them with descriptive messages.
- Push your changes to your fork.
- Submit a pull request to this repository.
This project is licensed under the License: CC-BY-4.0