Three.js Shaders (GLSL) Crash Course For Absolute Beginners

Three.js shaders crash course showing you 95% of what you'll ever need to know about shaders. We'll discuss things like how shaders work, GLSL language, vertex shader, fragment shader, dot product, useful GLSL functions, how to draw stuff and more... Links Mentioned In The Video: Extending Threejs Materials: https://youtu.be/vowT_8oVFmM Git Branches : https://github.com/visionary-3d/shaders-crash-course https://github.com/visionary-3d/shaders-crash-course/tree/shapes https://github.com/visionary-3d/shaders-crash-course/tree/organic Model View Projection (MVP) Article: https://jsantell.com/model-view-projection/ Perlin Noise Implementation In GLSL : https://github.com/visionary-3d/noise-collection/blob/main/glsl/perlin.glsl Beginner Three.js Crash Course: https://youtu.be/_OwJV2xL8M8 Basic Data Types ( for example in C ): https://youtu.be/sARaqR0hRI4?list=PL98qAXLA6aftD9ZlnjpLhdQAOFI8xIB6e Ducky 3D Tutorial: https://youtu.be/OKRqHmjkSwI Final Project's Source Code: https://github.com/visionary-3d/shaders-crash-course/tree/organic Chapters: 00:00 - Course Overview 00:25 - Shader Explanation 03:48 - Shader Setup 09:36 - GLSL Basics 33:15 - Attributes And Uniforms 45:51 - Model View Projection 49:25 - UVs And Normals 52:35 - Varyings 1:08:48 - Mindset 1:10:45 - Useful GLSL Functions 1:34:37 - Dot Product 1:37:39 - The Fresnel Effect 1:44:40 - Drawing Patterns 1:58:21 - Importing Textures 2:00:48 - Cool Desaturation Effect 2:03:19 - Final Project 2:56:12 - Outro --------------------- Visionary 3D: Contact me at Discord: (username): visionary3d Follow me: https://x.com/visionary_3_d