Three.js and TypeScript by Udemy
Learn Threejs, TypeScript and NodeJS to create interactive 3D content on the web.
Course Highlights
- Learn the Basics of Threejs with many demonstrations and example code
- Setup a Development Environment using VSCode, Git and NodeJS
- Install TypeScript
- Create a Threejs project using NPM and package json
- Learn about the VIte bundler and serving ES6 modules to the browser clients.
- Create (or optionally Install) a Threejs TypeScript Boilerplate for use throughout the course
- Learn about the Threejs Scene, Camera and Renderer
- Learn about the Animation loop
- Learn about the Stats, Dat GUI and lil-gui panels
- Learn about Object3D base class, and the Rotation, Position, Scale, Visibility and Matrix properties
- Learn about Geometries such as Box, Sphere, Icosahedron, Plane, TorusKnot and more
- Learn about the Basic, Normal, Phong, Standard, Physical and other materials
- Learn about PBR Roughness and Metalness
- Learn about lighting using the Ambient, Directional, Point and Spot lights.
- Learn about shadows using both the Perspective and Orthographic shadow cameras.
- Learn about the Orbit, Trackball and Pointerlock mouse and touch interaction controls
- Learn about loaders such as the GLTF, DRACO, OBJ, Texture, RGBE and more
- Import third party glTF/glB animations
- Animate using Lerp, JEasings and the Animation Mixer
- Use Raycaster and how to use it for mouse picking 3D objects in the scene,
- Physics with Rapier
- The Rapier Debug Renderer
- Understanding Shapes for Collision Detection
- Provision, Deploy and Start our Threejs Projects to a Production server
- Matching Blender Lighting and Environment Maps
- Install Nginx Proxy, Point a Domain Name and Install SSL
- And many more very useful examples of Threejs
Skills you will learn!
Curriculum
45 Topics
Introduction - How To Do This Course
Setup Development Environment
Create Course Boilerplate
Install Three.js and @three/types
Importing Three.js Modules
Stats Panel
Dat GUI
Install Three.js Course Boilerplate
Scene
Camera
Renderer
Animation Loop
Object3D
Object3D Hierarchy
Geometries
Materials
Common Materials
lil-gui
Lights
Shadows
Environment Maps
Loading Assets
Loading Multiple Assets
GLTF Loader : Part 1
GLTF Loader : Part 2
Raycaster
Orbit Controls
Lerp
JEasings
GLTF Animations
GLTF DRACO
Physics with Rapier
Rapier Debug Renderer
PointerLockControls
Rapier ImpulseJoint Motors
Obstacle Course Game : Part 1
Obstacle Course Game : Part 2
Deploying to Production
Host Using GitHub Pages
Host Using GitLab Pages
Provision a Cloud Server for Production
Install Nginx
Deploy Files to Server
Point Domain name
Add SSL
Three.js and TypeScript
Related Typescript Courses
Thank You!
Your review has been submitted successfully.