All Projects → httpstersk → three-js-fundamentals-r3f

httpstersk / three-js-fundamentals-r3f

Licence: other
Examples from the Three.js Fundamentals website recreated in react-three-fiber renderer.

Programming Languages

typescript
32286 projects
CSS
56736 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to three-js-fundamentals-r3f

EduSmart
It utilizes 3D, Augmented reality to give real-life simulations or feels of various models and make the learning process more impactful and fascinating. With an interactive live feature, students can ask the teacher their doubts instantly and also discuss.
Stars: ✭ 23 (-72.62%)
Mutual labels:  threejs, three-js, react-three-fiber
Vanta
Animated 3D backgrounds for your website
Stars: ✭ 1,162 (+1283.33%)
Mutual labels:  threejs, three-js
generative-art
🌈🎨 Generative Art is the idea realized as genetic code of artificial events, as construction of dynamic complex systems able to generate endless variations. This is also a nuxt-module (@luxdamore/nuxt-canvas-sketch) - [three.js, tensorflow.js and gsap are not included].
Stars: ✭ 41 (-51.19%)
Mutual labels:  threejs, three-js
Three Ui
UI solution for Three.js
Stars: ✭ 149 (+77.38%)
Mutual labels:  threejs, three-js
Wave Simulator
A graphical 3D simulation of the wave and heat equations
Stars: ✭ 5 (-94.05%)
Mutual labels:  threejs, three-js
Three.js Pathtracing Renderer
Real-time PathTracing with global illumination and progressive rendering, all on top of the Three.js WebGL framework. Click here for Live Demo: https://erichlof.github.io/THREE.js-PathTracing-Renderer/Geometry_Showcase.html
Stars: ✭ 872 (+938.1%)
Mutual labels:  threejs, three-js
Three Csgmesh
Conversion of a CSG library for use with modern THREE.js
Stars: ✭ 101 (+20.24%)
Mutual labels:  threejs, three-js
Hedron
Perform live shows with your three.js creations
Stars: ✭ 372 (+342.86%)
Mutual labels:  threejs, three-js
Threejs Sandbox
Set of experiments and extensions to THREE.js.
Stars: ✭ 163 (+94.05%)
Mutual labels:  threejs, three-js
Pipes
💿 Classic 3D Pipes screensaver remake (web-based)
Stars: ✭ 176 (+109.52%)
Mutual labels:  threejs, three-js
react-three-lightmap
In-browser lightmap/AO baker for react-three-fiber and ThreeJS
Stars: ✭ 107 (+27.38%)
Mutual labels:  react-three-fiber, r3f
Trois
✨ ThreeJS + VueJS 3 + ViteJS ⚡
Stars: ✭ 648 (+671.43%)
Mutual labels:  threejs, three-js
Roygbiv
A 3D engine for the Web
Stars: ✭ 499 (+494.05%)
Mutual labels:  threejs, three-js
Solarsys
Realistic Solar System simulation with three.js
Stars: ✭ 49 (-41.67%)
Mutual labels:  threejs, three-js
Vue Gl
Vue.js components rendering 3D WebGL graphics reactively with three.js
Stars: ✭ 434 (+416.67%)
Mutual labels:  threejs, three-js
A Mmd
A-Frame MMD component
Stars: ✭ 74 (-11.9%)
Mutual labels:  threejs, three-js
ng-three-examples
three.js examples in Angular 2
Stars: ✭ 24 (-71.43%)
Mutual labels:  threejs, three-js
Glas
WebGL in WebAssembly with AssemblyScript
Stars: ✭ 278 (+230.95%)
Mutual labels:  threejs, three-js
Three Mesh Bvh
A BVH implementation to speed up raycasting against three.js meshes.
Stars: ✭ 302 (+259.52%)
Mutual labels:  threejs, three-js
Patches
Patches is a visual programming editor for building WebVR and WebGL experiences.
Stars: ✭ 164 (+95.24%)
Mutual labels:  threejs, three-js

Three.js Fundamentals (R3F Version)

My journey learning react-three-fiber began by recreating examples from the Three.js Fundamentals website. I reckon it might get handy for someone, so I share the code on GitHub.


Three.js Fundamentals (React Three Fiber) Open Graph Image


1. Install the dependencies

$ npm i

2. Start a development server

$ npm run dev
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].