JavaScript Tutorial with Three.js - 5 Projects for Beginners

JavaScript Tutorial with Three.js - 5 Projects for Beginners

freeCodeCamp.org via freeCodeCamp Direct link

- 4:13 The Importance of Lighting

10 of 56

10 of 56

- 4:13 The Importance of Lighting

Class Central Classrooms beta

YouTube videos curated by Class Central.

Classroom Contents

JavaScript Tutorial with Three.js - 5 Projects for Beginners

Automatically move to the next video in the Classroom when playback concludes

  1. 1 - 0:00 Welcome & Course Overview
  2. 2 - 0:20 Projects You'll Build
  3. 3 - 0:51 Meet Your Instructor: Bobby Row
  4. 4 - 1:03 The 5 Standalone Projects
  5. 5 - 1:34 Skipping Around the Course
  6. 6 - 1:39 Getting Started with 3JS
  7. 7 - 2:23 Understanding the 3JS Toolbox
  8. 8 - 2:54 The Core 3JS Components Scene, Camera, Renderer
  9. 9 - 3:10 Geometries, Materials & Meshes
  10. 10 - 4:13 The Importance of Lighting
  11. 11 - 4:30 Simple Animations
  12. 12 - 4:57 The Beginner's Road Map
  13. 13 - 5:12 The Intermediate Road Map
  14. 14 - 6:21 The Advanced Road Map
  15. 15 - 6:45 Where to Find Help & Inspiration
  16. 16 - 7:08 Learn by Experimenting
  17. 17 - 7:26 An Introduction to Textures
  18. 18 - 7:50 Applying a Simple Texture
  19. 19 - 8:48 Handling Texture Aspect Ratios
  20. 20 - 10:50 Normal & Roughness Maps
  21. 21 - 12:20 Materials & Lighting
  22. 22 - 14:40 Understanding Normal Maps
  23. 23 - 15:11 Roughness Maps & Shininess
  24. 24 - 16:45 Experimenting with Different Textures
  25. 25 - 17:35 Building the 3D Globe
  26. 26 - 18:50 Setting Up the Sphere
  27. 27 - 21:56 Adding Stars to the Scene
  28. 28 - 22:54 Drawing Country Outlines
  29. 29 - 28:17 Using Fog for Depth
  30. 30 - 31:56 Adding Random Colors
  31. 31 - 34:50 Creating Particles
  32. 32 - 35:43 Building a Smoke Effect
  33. 33 - 37:12 Tweaking Particle Properties
  34. 34 - 39:38 Creating a Fire Effect
  35. 35 - 41:46 The Sparkly Dot Effect
  36. 36 - 45:50 The Role of Rotation
  37. 37 - 46:20 Scroll-Triggered Animations
  38. 38 - 46:55 Setting up HTML & CSS
  39. 39 - 48:25 Linking 3JS to the DOM
  40. 40 - 49:03 Responding to Scroll Events
  41. 41 - 50:42 Loading the Astronaut Model
  42. 42 - 53:48 Applying a Matcap Material
  43. 43 - 54:38 Linking Rotation to Scroll
  44. 44 - 55:29 Adding a Starfield
  45. 45 - 57:49 Smoothing the Animation
  46. 46 - 1:00:46 An Introduction to Physics with Rapier
  47. 47 - 1:02:00 Initial Scene Setup
  48. 48 - 1:05:27 Adding HDR Environment Lighting
  49. 49 - 1:07:49 Creating Metallic & Reflective Objects
  50. 50 - 1:09:08 Incorporating Different Geometries
  51. 51 - 1:10:45 Adding Rotational Physics
  52. 52 - 1:11:31 Visualizing Colliders
  53. 53 - 1:12:47 Using convexHull for Custom Colliders
  54. 54 - 1:17:31 Improving Mouse Interactivity
  55. 55 - 1:21:20 Integrating a GLTF Model
  56. 56 - 1:22:55 Adding a Color Palette

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.