Learn Three.js
The ultimate roadmap to mastering 3D web development. Whether you're a complete beginner or looking to master advanced GLSL shaders, follow our curated paths below.
Structured learning paths
1. The Fundamentals
Start here. Learn the core concepts of scenes, cameras, renderers, geometry, and materials.
- ✓ Setting up a scene
- ✓ Meshes & Geometries
- ✓ Lighting basics
2. React Three Fiber (R3F)
Take your React skills to the third dimension with declarative Three.js development.
- ✓ Canvas setup
- ✓ Drei helpers
- ✓ React state in 3D
3. Advanced Shaders
Unlock the true power of your GPU by writing custom GLSL shaders for materials and post-processing.
- ✓ GLSL Basics
- ✓ Vertex vs Fragment
- ✓ ShaderMaterial
4. Optimization & Performance
Ensure your 3D experiences run smoothly across all devices and browsers.
- ✓ Draw calls reduction
- ✓ InstancedMesh
- ✓ Texture compression
Premium Courses
Ready to commit to structured, professional learning? Check out our curated list of premium courses.