JavaScript Tutorial with Three.js – 5 Projects for Beginners

Learn fundamental JavaScript and Three.js with 5 stand-alone projects. ✏️ Course developed by @robotbobby9 0) Three.js Roadmap A roadmap to help you get started. Starting code: https://github.com/bobbyroe/getting-started-threejs/tree/start 1) Textures in Three.js Everything you need to know about applying textures to your 3D models Free Textures: https://polyhaven.com/textures 2) Create A 3D Globe Create a lovely globe with country outlines floating in the stars. 3D Globe code: https://github.com/bobbyroe/3d-globe-with-threejs 3) Simple Particle Effects Quick, easy-to-create effects like Fire, Smoke and Sparkles. Particle Effects: https://github.com/bobbyroe/Simple-Particle-Effects 4) Scroll Animation Smooth animation triggered by scrolling. Scroll Animation: https://github.com/bobbyroe/scroll-animation 5) Physics Variations Interactive physics project with Three.js and Rapier Physics. Physics: https://github.com/bobbyroe/physics-with-rapier-and-three Since each project is stand-alone, feel free to skip around! 🔗 Learn Three.js Basics Course: https://robotbobby.thinkific.com/courses/learn-threejs-basics ⭐️ Contents ⭐️ Course Introduction - 0:00 Welcome & Course Overview - 0:20 Projects You'll Build - 0:51 Meet Your Instructor: Bobby Row - 1:03 The 5 Standalone Projects - 1:34 Skipping Around the Course Project 0: 3JS Road Map - 1:39 Getting Started with 3JS - 2:23 Understanding the 3JS Toolbox - 2:54 The Core 3JS Components (Scene, Camera, Renderer) - 3:10 Geometries, Materials & Meshes - 4:13 The Importance of Lighting - 4:30 Simple Animations - 4:57 The Beginner's Road Map - 5:12 The Intermediate Road Map - 6:21 The Advanced Road Map - 6:45 Where to Find Help & Inspiration - 7:08 Learn by Experimenting Project 1: Textures - 7:26 An Introduction to Textures - 7:50 Applying a Simple Texture - 8:48 Handling Texture Aspect Ratios - 10:50 Normal & Roughness Maps - 12:20 Materials & Lighting - 14:40 Understanding Normal Maps - 15:11 Roughness Maps & Shinin