FreeThreeResource
Free & Curated Three.js
Learning Path
All the best resource from across the web
in the right order
Roadmap
1. pre-requisites
Beginner
Javascript: Variables, functions, arrays, objects, dom manipulation
2. Three.js Basics
Beginner
Scene, Camera, Renderer setup Basic Meshes (Box, Sphere) Lights (Ambient, Directional) Controls (OrbitControls) Animation with requestAnimationFrame
3. 3D model
intermediate
Load 3D models (GLTF/GLB) Textures & Environment Maps Model animations (AnimationMixer) Mouse interaction (Raycasting) Responsive & optimized rendering
4. animation and shaders
advanced
Scroll-based animation (GSAP + ScrollTrigger) Post-processing (Bloom, DOF) Custom shaders (GLSL) Particle systems Performance optimization