[HOT] Chia Sẻ Khóa Học ReactJS cho người mới bắt đầu 2020 (Udemy – Hậu Nguyễn) Update 9/2022

About Course

Views

Bạn sẽ được học:
Kiến thức nền tảng của ReactJS.
Quản lý form hiệu quả với React Hook Form.
Quản lý state với Redux Toolkit.
Làm giao diện nhanh và đơn giản với Material UI.
Thiết kế và triển khai API cho một dự án thực tế.
Tự tay cài đặt phần đăng nhập, đăng ký cho dự án (điều mà những bạn mới ít có cơ hội được làm)
Cùng mình code một dự án Shopping Cart để các bạn thấy được việc vận dụng kiến thức vào thực hành như thế nào.
Cách tổ chức files và folders như thế nào để dễ quản lý.
Thời lượng:
23 giờ (203 bài học + Tài liệu)
Giảng viên:
Hau Nguyen
Dung lượng:
14 GB
Link :
Cuối bài viết

Course Content

19. Hành trình mới – React 2022 updates

1. Hành trình mới – React 2022 updates.mp4

05:22
3. npm vs yarn (nguồn khoá javascript).mp4

21:03
4. Module Bundler (nguồn khoá javascript).mp4

27:20
5. Setup ReactJS project với ViteJS.mp4

10:39
6. Deploy to Vercel.mp4

06:34
7. Share ViteJS project online.mp4

05:32
8. Meta tags.mp4

06:35

9. Routing trong ReactJS

2. Tổng quan về routing trong ReactJS.mp4

03:56
3. Tạo routing cho từng feature.mp4

05:38
4. Sự khác biệt giữa Link và NavLink.mp4

05:39
5. Sự khác biệt giữa Route và Switch.mp4

03:54
6. Giới thiệu route matching.mp4

06:08
7. Tạo redirect rule với Redirect.mp4

03:59
8. Routing hooks.mp4

03:10
9. Nested routing.mp4

07:27
10. Not Found.mp4

03:56
11. Sync filters to URL params.mp4

04:01
12. Sync state to URL.mp4

06:31

8. Tổng quan về react hooks

7. Component life cycles

6. State và dữ liệu trong ReactJS

5. Props và Composition

4. Tổng quan về component

3. Setup auto deploy với Vercel

21. React hooks

10. Cách chia sẻ dữ liệu giữa các components.mp4

08:52
19. Labs 3 bài tập còn lại.mp4

08:23
18. Lab Swap two form fields.mp4

06:29
17. Lab Disappearing Input Text.mp4

05:16
16. Các cách reset state trong ReactJS.mp4

08:37
15. Preserving State.mp4

15:06
14. Lab Filtering List.mp4

07:36
13. Lab Synced Inputs.mp4

05:54
12. Controlled vs Uncontrolled component.mp4

05:02
11. Accordion – Lifting State Up use case.mp4

08:49
1. Giới thiệu về hooks.mp4

03:44
9. useState – useImmer().mp4

08:51
8. useState – updating objects arrays.mp4

12:32
7. useState – updating state based on the prev state.mp4

10:39
6. useState – initializer.mp4

10:22
5. setState is async.mp4

06:19
4. useState và rules of hooks.mp4

10:34
3. Array destructuring.mp4

04:42
2. State là gì .mp4

07:21

20. ReactJS typescript cơ bản

1. Nội dung chương 20.mp4

01:37
2. Khai báo components.mp4

10:46
3. named và default export.mp4

07:55
4. Props và một số lưu ý.mp4

11:59
5. Thực hành Props P1.mp4

08:27
6. Thực hành Props P2.mp4

08:27
7. tsconfig paths.mp4

04:45
8. Do Not Mutate Props.mp4

07:15
9. Function Props.mp4

12:43
10. props.children là gì.mp4

05:54
11. Khai báo kiểu dữ liệu cho props.children.mp4

11:48
12. Sử dụng props.children – Layout.mp4

04:41
13. Sử dụng props.children – Widget.mp4

07:57
14. Conditional rendering.mp4

10:45
15. Practice conditional rendering.mp4

08:51
16. List rendering.mp4

09:22

2. Cài đặt môi trường làm việc

1. Tổng quan về ReactJS

18. Shopping Cart – Trang giỏ hàng

17. Shopping Cart – Trang chi tiết sản phẩm

1. Giới thiệu trang chi tiết sản phẩm.mp4

03:40
2. Setup layout cho trang chi tiết sản phẩm.mp4

06:07
3. Code component ProductThumbnail.mp4

04:18
4. Custom hook fetch dữ liệu sản phẩm.mp4

12:18
5. Code component ProductInfo.mp4

15:02
6. Cách kiểm tra và update packages trong dự án.mp4

09:06
7. Form add to cart.mp4

10:11
8. Code QuantityField.mp4

10:55
9. Code component ProductMenu.mp4

08:55
10. Code các sub-components của product.mp4

05:48
11. An toàn render dữ liệu HTML lên UI.mp4

07:01
12. Show progress khi fetch dữ liệu.mp4

04:10

16. Shopping Cart – Trang danh sách sản phẩm

12. Sắp xếp theo giá sản phẩm.mp4

11:59
23. Hỗ trợ nút back trên trình duyệt.mp4

11:57
22. Đồng bộ filters lên URL.mp4

15:32
21. Dùng useMemo() để cải thiện tí xíu.mp4

02:41
20. Code phần hiển thị filters.mp4

19:28
19. Phân tích cách hiển thị filters.mp4

06:22
18. Lọc theo dịch vụ sản phẩm.mp4

15:07
17. Giao diện lọc khoảng giá.mp4

05:30
16. Lọc theo khoảng giá.mp4

12:00
15. Giao diện lọc danh mục sản phẩm.mp4

05:34
14. Lọc theo danh mục sản phẩm.mp4

16:29
13. Phân tích cách làm filters.mp4

06:02
1. Giới thiệu về tính năng giỏ hàng.mp4

02:48
11. Fix giao diện Pagination.mp4

08:43
10. Làm chức năng Pagination.mp4

16:00
9. Format giá sản phẩm theo đơn vị VND.mp4

05:43
8. Xử lý thumbnail cho sản phẩm.mp4

12:58
7. Hiển thị danh sách sản phẩm.mp4

10:39
6. Làm skeletons cho danh sách sản phẩm.mp4

12:37
5. Viết API lấy danh sách sản phẩm.mp4

09:46
4. Setup layout cho Product Listing.mp4

08:51
3. Phân tích layout trang Product Listing.mp4

04:48
2. Setup routing cho feature Product.mp4

06:11

15. Authentication Module

16. Fix lỗi import package từ node_modules ra sai link.mp4

01:53
29. Làm tính năng đăng xuất.mp4

06:21
28. Tạo drop down menu cho user icon.mp4

06:36
27. Hiển thị header khi đã đăng nhập.mp4

05:08
26. Khởi tạo redux state từ localStorage.mp4

03:46
25. Tạo hằng số cho dự án.mp4

04:02
24. Tạo nút chuyển đổi qua lại giữa đăng nhập và đăng ký.mp4

04:25
23. Tạo giao diện cho form đăng nhập.mp4

07:46
22. Setup API đăng nhập.mp4

02:40
21. Thêm close icon vào dialog.mp4

04:09
20. Parse error khi đăng ký thất bại.mp4

08:32
19. Thông báo thành công.mp4

05:06
18. Hiển thị thông báo với notistack.mp4

06:08
18. Hiển thị thông báo với notistack.mp4

06:08
17. Hiển thị loading khi gọi action đăng ký.mp4

07:26
1. Giới thiệu module Auth.mp4

02:13
15. Sử dụng async action trên component như thế nào.mp4

08:23
14. Tạo async action register().mp4

08:36
13. Setup userSlice.mp4

03:30
12. Setup API đăng ký.mp4

03:10
11. Validation Retype Password.mp4

04:03
10. Validation Password.mp4

05:16
9. Validation Email.mp4

02:13
8. Validation Full Name.mp4

06:52
7. Tạo custom field PasswordField.mp4

11:11
6. Style cho form đăng ký.mp4

08:15
5. Setup form đăng ký.mp4

08:39
4. Tạo dialog để hiển thị form đăng ký.mp4

04:58
3. Gắn link vào menu item trên header.mp4

03:05
2. Làm giao diện thanh header.mp4

05:03

14. Những cách khác nhau để styles cho component

13. Quản lý state với Redux

2. Tổng quan về Redux.mp4

08:11
3. Một ví dụ đơn giản về Redux.mp4

05:25
4. Dùng Redux đơn giản hơn với Redux Toolkit.mp4

07:02
5. Ví dụ sử dụng Redux Toolkit.mp4

06:36
6. Setup counterSlice.mp4

04:56
7. Setup Redux Store.mp4

05:22
8. Kết nối tới Redux từ component.mp4

06:24
9. Debug Redux dễ dàng với Redux Devtool.mp4

03:04
10. Xử lý relative import với jsconfig.json.mp4

03:52

12. Làm việc với Form trong ReactJS

11. Hướng dẫn tổ chức module API

10. Prettier và Material UI

Student Ratings & Reviews

No Review Yet

About Course

Course Content

19. Hành trình mới – React 2022 updates

1. Hành trình mới – React 2022 updates.mp4

3. npm vs yarn (nguồn khoá javascript).mp4

4. Module Bundler (nguồn khoá javascript).mp4

5. Setup ReactJS project với ViteJS.mp4

6. Deploy to Vercel.mp4

7. Share ViteJS project online.mp4

8. Meta tags.mp4

9. Routing trong ReactJS

2. Tổng quan về routing trong ReactJS.mp4

3. Tạo routing cho từng feature.mp4

4. Sự khác biệt giữa Link và NavLink.mp4

5. Sự khác biệt giữa Route và Switch.mp4

6. Giới thiệu route matching.mp4

7. Tạo redirect rule với Redirect.mp4

8. Routing hooks.mp4

9. Nested routing.mp4

10. Not Found.mp4

11. Sync filters to URL params.mp4

12. Sync state to URL.mp4

8. Tổng quan về react hooks

2. Tổng quan về hooks.mp4

3. useState() – Những điều cần biết.mp4

4. useEffect() – Những điều cần lưu ý.mp4

5. Custom hook là gì.mp4

6. useCallback vs useMemo.mp4

7. Component life cycles

1. Tổng quan về các life cycles.mp4

2. constructor().mp4

3. componentDidMount().mp4

4. componentWillUnmount().mp4

5. componentDidUpdate().mp4

6. Fix error cant setState on unmounted component.mp4

6. State và dữ liệu trong ReactJS

1. State là gì.mp4

2. Lab Active Todo.mp4

3. Lab Filter Todo.mp4

4. So sánh giữa Props và State.mp4

5. Props và Composition

1. Props là gì Composition là gì.mp4

2. Props type checking.mp4

3. Render elements in reactjs.mp4

4. Folder structure.mp4

5. Lab TodoList.mp4

6. Lab AlbumList.mp4

4. Tổng quan về component

1. JSX – Cú pháp được sử dụng trong ReactJS.mp4

2. Mount component lên DOM với ReactDOM.render().mp4

3. Component – Trung tâm vũ trụ của ReactJS.mp4

4. Phân biệt giữa Container và Presentational component.mp4

5. Bài tập phân tích cây component 1.mp4

6. Bài tập phân tích cây component 2.mp4

7. Bài tập phân tích cây component 3.mp4

3. Setup auto deploy với Vercel

1. 2 cách khác nhau để clone một Github repository.mp4

2. Tạo SSH key dưới local.mp4

3. Thêm SSH key vào tài khoản Github.mp4

4. Push code lần đầu lên Github.mp4

5. Cấu hình auto deploy với Vercel.mp4

21. React hooks

10. Cách chia sẻ dữ liệu giữa các components.mp4

19. Labs 3 bài tập còn lại.mp4

18. Lab Swap two form fields.mp4

17. Lab Disappearing Input Text.mp4

16. Các cách reset state trong ReactJS.mp4

15. Preserving State.mp4

14. Lab Filtering List.mp4

13. Lab Synced Inputs.mp4

12. Controlled vs Uncontrolled component.mp4

11. Accordion – Lifting State Up use case.mp4

1. Giới thiệu về hooks.mp4

9. useState – useImmer().mp4

8. useState – updating objects arrays.mp4

7. useState – updating state based on the prev state.mp4

6. useState – initializer.mp4

5. setState is async.mp4

4. useState và rules of hooks.mp4

3. Array destructuring.mp4