Book Image

Learn Three.js - Fourth Edition

By : Jos Dirksen
Book Image

Learn Three.js - Fourth Edition

By: Jos Dirksen

Overview of this book

Three.js has become the industry standard for creating stunning 3D WebGL content. In this edition, you’ll learn about all the features of Three.js and understand how to integrate it with the newest physics engines. You'll also develop a strong grip on creating and animating immersive 3D scenes directly in your browser, reaping the full potential of WebGL and modern browsers. The book starts with the basic concepts and building blocks used in Three.js and helps you explore these essential topics in detail through extensive examples and code samples. You'll learn how to create realistic-looking 3D objects using textures and materials and how to load existing models from an external source. Next, you'll understand how to control the camera using the Three.js built-in camera controls, which will enable you to fly or walk around the 3D scene you've created. Later chapters will cover the use of HTML5 video and canvas elements as materials for your 3D objects to animate your models. You’ll learn how to use morph targets and skeleton-based animation, before understanding how to add physics, such as gravity and collision detection, to your scene. Finally, you’ll master combining Blender with Three.js and creating VR and AR scenes. By the end of this book, you'll be well-equipped to create 3D-animated graphics using Three.js.
Table of Contents (21 chapters)
Part 1: Getting Up and Running
Part 2: Working with the Three.js Core Components
Chapter 5: Learning to Work with Geometries
Part 3: Particle Clouds, Loading and Animating Models
Part 4: Post-Processing, Physics, and Sounds

What this book covers

Chapter 1, Creating Your First 3D Scene with Three.js, introduces the Three.js library, explains how to set up your development environment, and shows how to create your first application.

Chapter 2, The Basic Components that Make up a Three.js Application, explains the core concepts behind Three.js and introduces the basic components you’ll need for each Three.js application.

Chapter 3, Working with Light Sources in Three.js, goes through all the available light sources you can use in Three.js to add lights to your Three.js scenes.

Chapter 4, Working with Three.js Materials, shows an overview of the different materials you can use when creating the objects you’re visualizing with Three.js.

Chapter 5, Learning to Work with Geometries, explains which basic geometries are provided with Three.js and how you can use and customize them.

Chapter 6, Exploring Advanced Geometries, goes into detail explaining the advanced geometries provided by Three.js.

Chapter 7, Points and Sprites, describes how you can create and manipulate a large number of points and sprites on the screen, and how to change what these points look like.

Chapter 8, Creating and Loading Advanced Meshes and Geometries, gives examples and instructions on how to group and merge objects together, and how to load existing models from external sources.

Chapter 9, Animations and Moving the Camera, talks about the different camera controls provided by Three.js, and explains how animations work in Three.js and how to load animations from external sources.

Chapter 10, Loading and Working with Textures, gives an overview of the different types of textures that are available in Three.js, and how you can use them to configure the Three.js materials.

Chapter 11, Render Postprocessing, describes how you can add post-rendering effects such as blur, bloom, and colorify to your scene.

Chapter 12, Adding Physics and Sounds to Your Scene, introduces the Rapier physics library, which allows you to have objects interact with each other simulating the real world. This chapter also shows how you can add positional sound to your scenes.

Chapter 13, Working with Blender and Three.js, provides information on how you can integrate Blender with Three.js, exchange models, and use Blender to bake specific textures.

Chapter 14, Three.js Together with React, TypeScript, and Web-XR, shows how you can combine Three.js with React and TypeScript, and gives an overview of the support Three.js has for the Web-XR standard to create VR and AR scenes.