Mô tả

Welcome to my course on React Three Fiber, where you will learn how to build immersive and creative 3D websites using Three.js and React

In this course, you will learn all about Three.js and some of React basics so that you are able to create 3D websites under a library called React Three Fiber

This course is in 6 main sections,

1. Three.js Refresher: Some lessons from my three.js course will be reviewed, so you can understand what will be explained later

2. React: Some React basics will be explained cause this course is mainly about writing React code

3. React Three Fiber: This is where the actual course begins, where you will learn how to write and combine Three.js with React

4. React Three Drei: React is about building reusable components, We will cover a lot of the components that Drei have

5. React Spring: We will learn a physics-based animation library to make your site looks better

6. React Post-Processing: Post-processing are filters that will add beauty to the scene


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

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

How to install ThreeJs library and import it into your project

Learn the basics of ThreeJs with many demonstrations and example code

Learn about the ThreeJs Scene, Camera and Renderer

Creating our very first scene in ThreeJs

How to move and animate the Objects

Learn about Webpack, NodeJs ,and serving ES6 modules to the browser clients.

Learn about Geometries such as Box, Sphere, Plane, Torus, TorusKnot and more

Learn about the Basic, Normal, Lambert, Phong, Standard, Matcap and other materials

We also will learn how to create a stunning Scene using Particles

Learn React Basics and hooks such as useState,useEffect,useRef, etc

Learn what is meant by JSX

Will also learn about React Rules, Styles, etc

Will bring everything we have done so far in native threejs to react environment under what is called React Three Fiber

A lot of Drei components will be covered

Learn how to animate things while scrolling

How to add sound in the project

Shader Materials

We will learn an animation library called React Spring

React Post Processing

And so much more . . .

Yêu cầu

  • A device that you can install VSCode or any Code Editor
  • Basic JavaScript knowledge, you should be familiar with let, const, loops, arrays, functions
  • And the most two important things are to be patient ( please be patient ), and to have a desire to build 3D Web Applications

Nội dung khoá học

7 sections

Three.Js Refresher

8 lectures
1 - Hello Cube
32:40
2 - Transformation
24:33
3 - Animation
18:07
4 - Webpack
10:50
5 - Geometries
19:23
6 - Textures
14:46
7 - Materials
27:38
8 - Particles
16:17

React

11 lectures
1 - Introduction to React
13:13
2 - First React Application
08:10
3 - React Rules
08:25
4 - Styles in React
03:19
5 - Components
03:58
6 - Building a Counter using UseState hook
15:05
7 - UseEffect
13:37
8 - Rendering Elements Conditionally
05:56
9 - Props
16:53
10 - React.memo
04:46
11 - UseRef
05:57

React Three Fiber

8 lectures
1 - Introduction to React Three Fiber
03:42
2 - Build Our First React Fiber Application
41:14
3 - Build Our First React Fiber Application
18:20
4 - useLoader
03:30
5 - Particles
12:47
6 - Loading 3D Model _ Playing Animations
36:22
7 - Debug
12:50
8 - Events
13:55

React Three Drei

8 lectures
1 - Introduction To Drei
00:57
2 - Environment & Staging
28:30
3 - Camera
06:47
4 - Controls
01:07:27
5 - Text, 3DText and Html
13:30
6 - Positional Audio
02:42
7 - Shaders
20:49
8 - MeshPortalMaterial
18:51

React Spring

7 lectures
1 - Introduction to React Spring
03:11
2 - Getting Started
10:14
3 - Imperative API
08:29
4 - Props
23:13
5 - SpringRef
07:20
6 - useSprings
13:28
7 - useTrail
05:27

React Three Rapier

7 lectures
1 - Hello Physics
07:51
2 - Colliders
13:08
3 - Rigid Body Methods
15:43
4 - Mass
03:42
5 - Types
19:29
6 - Instanced Mesh
08:50
7 - Sensor
03:30

React Post-Processing

1 lectures
Post-Processing
27:48

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.