Download
Build your scene declaratively with re-usable, self-contained components that react to state, are readily interactive, and can tap into React's ecosystem. There is no hard dependency on a particular three.js version, it does not wrap or duplicate a single three.js class. It merely expresses three.js in JSX, <mesh /> becomes new THREE.Mesh(), and that happens dynamically. There is no additional overhead. Components participate in a unified render loop outside of React. It outperforms three.js at scale due to React's scheduling abilities.Y ou need to be versed in both React and three.js before rushing into this. If you are unsure about React consult the official React docs, especially the section about hooks.
Features
- Everything that works in three.js will work here without exception
- Make sure you have a basic grasp of three.js
- When you know what a scene is, a camera, mesh, geometry, material, fork the demo
- Look up the JSX elements that you see (mesh, ...), all three.js exports are native to React Three Fiber
- Try changing some values, scroll through our API to see what the various settings and hooks do
- Turns GLTFs into JSX components
Project Samples
