Three Js A Resourceful Guide

Welcome to the exciting realm of Three.js - a dynamic JavaScript library empowering developers to craft mesmerizing 3D graphics for the web effortlessly. Whether you're taking your first steps or you're an experienced hand, Three.js offers a myriad of tools and resources to unleash your creativity and bring your visions to life.

Core Resources

• ThreeJS Official Website: Your go-to destination for all things Three.js. Delve into documentation, explore examples, and kickstart your 3D projects.
• ThreeJS Examples: Immerse yourself in interactive demonstrations showcasing the versatility of Three.js. Experiment and learn through hands-on exploration.
• ThreeJS Documentation: Master the fundamentals with comprehensive documentation explaining core concepts and scene creation in Three.js.

Books for In-depth Knowledge

3D Theory

• 3D Math Primer for Graphics and Game Development: Dive into the intricacies of 3D mathematics with this essential guide.
• Physically Based Rendering - From Theory to Implementation: Explore the world of Physically Based Rendering through this invaluable resource.

Creative Coding

• The Nature of Code: Embark on a journey of creativity with this insightful book by the witty author Dan Shiffman.

ThreeJS Specific

• Discover Three.js: Uncover the depths of Three.js through this insightful resource.
• Learn Three.js - Third Edition: A comprehensive guide to mastering Three.js.

Interactive Courses

ThreeJS

• ThreeJS Journey: Perfect for beginners, this course by Bruno Simon offers a step-by-step approach to mastering ThreeJS.

Shaders

• The Easiest Way to Learn GLSL: Dive into the world of shaders with this comprehensive course.
• The Book of Shaders: Master the art of shader programming with this free online resource.

Insightful Articles and Tutorials

Documentation

• ThreeJS Fundamentals: A comprehensive guide covering the foundational aspects of Three.js.
• Shaderific for OpenGL: Documentation on GLSL for OpenGL.
• GLSL Documentation: Detailed documentation on GLSL syntax and functions.

3D Theory

• Explaining Homogeneous Coordinates & Projective Geometry: A detailed article elucidating homogeneous coordinates and projective geometry.

Tutorials

• Surface Sampling in Three.js: Learn about MeshSurfaceSampler through this comprehensive tutorial.
• How to Create a Fake 3D Image Effect with WebGL: Discover how to add depth to 2D images using Three.js.
• Tutorial on Matrices: A clear tutorial on understanding shader projection, view, and model matrices.

Advanced Topics

• Real-time rendering of water caustics: Explore a clever approach to rendering water caustics in real-time.
• Realtime fluid simulation: An insightful article on creating realistic water simulations.

Drawing Inspiration

Common

• same.energy: A visual search engine for inspiration based on keywords or images.
• Pinterest: A treasure trove of creative ideas and inspirations.

Shaders

• ShaderToy: Prepare to be amazed by the vast collection of shaders shared on this platform.

Engaging Videos

Shaders

• ShaderShop videos: Dive into the world of shaders with these captivating videos.

Valuable Resources

Matcaps

• Matcap Repository: A collection of Matcaps for use in Three.js.

3D Assets

• Poliigon: Explore a plethora of assets for 3D artists including textures, models, and HDRI.
• Poly Haven: Access a vast library of CC0 3D assets including textures, models, and HDRI.

Textures

• 3D Textures: Discover a wide range of free PBR textures for your projects.
• Arroway Textures: High-quality digital textures for 3D rendering and real-time applications.
• ambientCG: A collection of CC0 textures tailored for Physically Based Rendering.

GLSL Shaders

Main

• Signal shaping functions: A valuable resource offering signal shaping patterns for GLSL shaders.
• Shaping functions: Explore a set of creative coding shaping functions.

Visuals

• Book of Shaders: An interactive guide to understanding shaders.

Code Examples

• Three.js Journey - Code Examples: Access code examples from the Three.js Journey course.

Community

• Three.js Discourse: Join the official community to connect with fellow developers, seek advice, and collaborate.

Conclusion

Whether you’re a seasoned developer seeking to expand your skills or a novice eager to embark on a creative journey, the resources outlined above serve as invaluable assets in your exploration of Three.js. With its vast array of features and supportive community, the world of 3D graphics has never been more accessible.