Ưu đãi trong tuần: Nhập mã UD50 giảm 50k cho đơn từ 300k!
Trang chủ
Menu

Learn Three.Js and Shaders from scratch

Học Three.Js và Shaders từ con số 0

Học Three.Js và Shaders từ con số 0

Nắm vững mọi kiến thức cần thiết về Three JS và Shaders để xây dựng các Website sáng tạo và sống động

4.5
(274 đánh giá)
2,227 học viên
Giảng viên
Ahmad Al-shurafa
Phụ đề Việt chất lượng cao Phụ đề tiếng Anh Bán chạy Đánh giá cao
50.000đ 349.000đ -86%
✓ Xem giỏ hàng và thanh toán
Bao gồm phụ đề tiếng Việt, tiếng Anh
9.5 giờ video
31 bài giảng
Truy cập vĩnh viễn
Học trên mọi thiết bị
Cập nhật: 30/05/2026

Bạn sẽ học được gì

Cách cài đặt thư viện ThreeJs và tích hợp vào dự án của bạn
Học kiến thức cơ bản về ThreeJs qua nhiều minh họa và ví dụ code
Tìm hiểu về Scene, Camera và Renderer trong ThreeJs
Tạo cảnh 3D đầu tiên của bạn với ThreeJs
Cách di chuyển và tạo chuyển động cho các đối tượng
Tìm hiểu về Webpack, NodeJs và cách cung cấp ES6 modules cho trình duyệt
Khám phá Gsap Package và cách sử dụng
Cách điều chỉnh tỷ lệ cảnh 3D và tối ưu hiển thị trên mọi màn hình
Tìm hiểu về các dạng hình học: Box, Sphere, Plane, Torus, TorusKnot và nhiều loại khác
Tìm hiểu về các dạng hình học: Box, Sphere, Plane, Torus, TorusKnot và nhiều loại khác
Khám phá bí quyết đằng sau những dự án 3D thành công
Tìm hiểu về các loại vật liệu: Basic, Normal, Lambert, Phong, Standard, Matcap và nhiều loại khác
Tìm hiểu về Bumpmap và Displacement Maps
Làm chủ Dat GUI panels
Mọi kiến thức về Ánh sáng và Bóng đổ sẽ được trình bày đầy đủ
Đi sâu vào OrbitControls
Học cách tạo cảnh 3D ấn tượng bằng Particles
Tìm hiểu về các trình tải mô hình: OBJ, GLTF, DRACO, FBX và nhiều định dạng khác
Cách sử dụng Raycaster để tương tác chọn đối tượng 3D bằng chuột
Tạo Animation tùy chỉnh và Xuất từ Blender
Học Shaders (GLSL) để xây dựng website sáng tạo và sống động
Hướng dẫn chi tiết cách tạo vertex và fragment shaders
Khám phá GLSL Built-in function, Noises và cách nhập texture vào shader
Giải thích về Post Processing
Và còn rất nhiều kiến thức khác...

Yêu cầu

Thiết bị có thể cài đặt VSCode hoặc bất kỳ trình soạn thảo code nào
Kiến thức JavaScript cơ bản: quen thuộc với let, const, vòng lặp, mảng, hàm
Hai điều quan trọng nhất: kiên nhẫn (hãy thật kiên nhẫn) và mong muốn xây dựng ứng dụng Web 3D

Đối tượng phù hợp

Lập trình viên Web mới bắt đầu muốn học ThreeJs
Front end developer muốn tìm hiểu về ThreeJs
Web developer muốn tạo website 3D sáng tạo và sống động

Nội dung khóa học

4 phần • 31 bài giảng
1 1 - Chào mừng đến với khóa học
2 2 - WebGL và ThreeJs là gì
3 3 - Hello Cube
4 4 - Biến đổi đối tượng
5 5 - Tạo chuyển động
6 6 - Webpack
7 7 - Sức mạnh của Toán học và Gsap
8 8 - LookAt
9 9 - Tối ưu hiển thị
10 10 - Camera
11 11 - OrbitControl
12 12 - Các dạng hình học
13 13 - Texture
14 14 - Vật liệu
15 15 - Gỡ lỗi
16 16 - Ánh sáng
17 17 - Bóng đổ
18 18 - Particles
19 19 - Raycaster
20 20 - Mô hình 3D phần một
21 21 - Mô hình 3D phần hai
1 Cannon-es
1 1 - Giới thiệu về shaders
2 2 - Vertex Shader và Fragment Shader là gì
3 3 - Attributes
4 4 - Uniforms
5 5 - Hàm dựng sẵn
6 6 - Noises
7 7 - Áp dụng Texture với Shaders
8 8 - Post Processing
1 Chuyển đổi Mesh thành particles với hiệu ứng chuyển động

Giới thiệu khóa học

Welcome to my course on ThreeJs and Shaders, where you will learn how to build immersive and creative 3D websites

In this course we will learn all about Three.js and Shaders , we are also going to share some of the project's secrets soon

The course is in 3 main sections,

  1. the Introduction Section : Where we will learn everything related to this library, starting with how to create a cube inside the scene and then how to animate that cube, how to add lights, shadows, particles and so much more.

  2. the Shaders Section : we will learn shaders from scratch and you will be amazed by the things that you will be able to do when you master shaders, all you have to do is one thing which is be patient while learning

  3. the Projects Section : in this section, we will share some of the project's secrets

All code is provided in the resources folder where you can find the Startup folder which is the code at the beginning of the lecture, and the Last Code folder which is the written code after we finished the lesson.

If you encounter any questions regarding a particular lesson, I hope that you will ask the question in the questions section I will answer all questions, so don't be afraid to ask any question


Thanks for participating in my course, and I will see you there.

Ahmad

Khóa học liên quan

Khám phá thêm các khoá học cùng chủ đề

Hiển thị tất cả khoá học Computer Graphics
Hiển thị tất cả khoá học Javascript
Hiển thị tất cả khoá học Three Js
Hiển thị tất cả khoá học Web Development
Zalo
Tôi có thể tư vấn khoá học cho bạn 😊