## Introduction

> Want to learn more about this course before buying? Check out its detailed landing page here: [https://chriscourses.com/threejs-bundle](/content/threejs-bundle/index.html)

Shaders are notoriously hard to deal with—there is little to no debug tools available, while support and learning material online is little to none. I created this tutorial as a method to alleviate the stress involved with learning 3D shaders with Three.js.

Every important piece of complex jargon will be explained in plainspeak within this tutorial, including: **Vertex Shaders**, **Fragment Shaders**, **UVs**, and **Normals.**

In the end, you'll have created a realistic globe using custom atmospheric-like shaders.

🔗 Project Links

- [https://chriscourses.com/demos/intermediate-threejs/](/content/demos/intermediate-threejs/index.html)
- [Comprehensive List of Three.js Geometry](https://threejs.org/docs/index.html?q=geometry#api/en/core/BufferGeometry)
- [Three.js Uniforms and Attributes](https://threejs.org/docs/index.html?q=web#api/en/renderers/webgl/WebGLProgram)
- [TailwindCSS CDN](https://tailwindcss.com/docs/installation#using-tailwind-via-cdn)

🌠 GLSL Documentation Links

- [Mat4](https://thebookofshaders.com/glossary/?search=mat4)
- [Texture2D](https://thebookofshaders.com/glossary/?search=texture2D)
- [Dot Operator](https://thebookofshaders.com/glossary/?search=dot)
- [Normalize](https://thebookofshaders.com/glossary/?search=normalize)