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

Big React JS Course With AI (Redux / Router / Tailwind CSS)

Khóa Học React JS Chuyên Sâu Kết Hợp AI (Redux / Router / Tailwind CSS)

Khóa Học React JS Chuyên Sâu Kết Hợp AI (Redux / Router / Tailwind CSS)

Khóa Học React JS Toàn Diện + Nghiên Cứu Đầy Đủ Các Thư Viện Hệ Sinh Thái React (Redux / Router) & Tailwind CSS Với AI

4.8
(93 đánh giá)
648 học viên
Giảng viên
Dmitrii Fokeev
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
25.0 giờ video
203 bài giảng
Truy cập vĩnh viễn
Học trên mọi thiết bị
Cập nhật: 05/08/2026

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

Nghiên cứu mọi khía cạnh của thư viện React JS
Học thư viện định tuyến — React Router
Học thư viện quản lý trạng thái — React Redux
Thành thạo cú pháp hiện đại của Redux Toolkit
Thành thạo cú pháp hiện đại của React Router 6.4+
Tìm hiểu về các bản cập nhật mới nhất của thư viện React và phương pháp phát triển hiện đại
Học cách xây dựng ứng dụng web với mọi độ phức tạp
Nghiên cứu framework tạo kiểu cho ứng dụng web — Tailwind CSS
Tạo nhiều ứng dụng, bao gồm trình quản lý công việc và cửa hàng trực tuyến
Học cách tối ưu hóa ứng dụng React
Hiểu cách React hoạt động "bên dưới lớp vỏ"
Học tất cả các hooks và phương thức cần thiết của React JS
Nghiên cứu phương pháp phát triển web hiện đại
Học cách sử dụng mạng nơ-ron trong phát triển web với React

Yêu cầu

Yêu cầu kiến thức cơ bản về JavaScript / HTML / CSS cho khóa học

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

Dành cho Lập Trình Viên Front End Web
Dành cho Lập Trình Viên Web

Nội dung khóa học

20 phần • 203 bài giảng
1 Chào mừng!
2 Tải Tài Liệu Khóa Học
3 Lưu Ý
4 Thiết Lập Môi Trường Phát Triển
5 Cấu Hình VS Code
6 Cách Học Khóa Học
1 Cách Hoạt Động Của Hàm
2 Phương thức find
3 Destructuring Mảng và Đối Tượng
4 Toán Tử Rest & Spread
5 Template Literals
6 If/Else \ Toán Tử Ba Ngôi
7 Toán Tử Logic (&&, ||, ??)
8 Optional Chaining
9 Phương Thức Map
10 Phương Thức Filter
11 Phương Thức Reduce
12 Phương Thức Sort
13 Async JS – Promises
14 Async JS – Async/Await
1 Tạo Dự Án React Mới
2 Hello React!
3 Giới Thiệu Về Components
4 Tạo React Elements
5 Cách JSX Hoạt Động
6 Sử Dụng JSX Để Render Có Điều Kiện
7 Cách CSS Hoạt Động Trong React
8 Cách Đường Dẫn Hoạt Động Trong Vite
9 Tóm Tắt: Quy Tắc JSX
10 Cách Props Hoạt Động
11 Thực Hành: Làm Việc Với Props
12 Tóm Tắt: Props
13 Phương Thức Map Trong React
14 Destructuring Trong Props
15 React Fragment Là Gì
16 Ba Loại Render Có Điều Kiện
17 Thực Hành Với Toán Tử Ba Ngôi
18 Thực Hành: Làm Việc Với Props (Phần 2)
1 Sự Kiện Trong React
2 Cách useState Hoạt Động
3 Cập Nhật State Dựa Trên State Trước Đó
4 State vs Biến
5 Khai Báo vs Mệnh Lệnh
6 Render Có Điều Kiện Với useState
7 onMouseEnter Với useState
8 React DevTools
9 Thực Hành: State Tabs
10 Thực Hành: Máy Tính
1 Tổng Quan Dự Án
2 Tạo Cấu Trúc Dự Án
3 Render Có Điều Kiện Để Mở/Đóng
4 Tạo Mảng Công Việc
5 Tạo Công Việc Đang Hoạt Động
6 Hoàn Thiện Tính Năng Công Việc
7 Tạo Tính Năng Sắp Xếp
1 Cấu Trúc Tệp Của Ứng Dụng React
2 Tạo Component Phổ Quát
3 Cách PropTypes Hoạt Động
4 Cách Prop Children Hoạt Động
5 Cách Prop Drilling Hoạt Động
6 Component Composition Là Gì
7 Hoàn Thiện Thư Viện UI
8 Truyền Component Tường Minh
9 Tóm Tắt Phần
10 Thực Hành: Modal Phổ Quát
1 Kết Nối Đến Weather API
2 useState Trong Logic Render
3 Làm Quen Với useEffect
4 Thêm Logic useEffect
5 Xử Lý Lỗi (Phần 1)
6 Xử Lý Lỗi (Phần 2)
7 Sử Dụng Dữ Liệu Từ API
8 Mảng Phụ Thuộc Trong useEffect
9 useEffect Không Có Mảng Phụ Thuộc
10 Thêm Logic Có Điều Kiện
11 Thêm Tính Năng Geolocation
12 Side Effect Là Gì?
13 Hàm Dọn Dẹp
14 Race Condition
15 Sự Kiện Cho Làm Việc Với Side Effects
16 Thực Hành: Chuyển Đổi Tiền Tệ (Đơn Giản)
17 Thực Hành: Danh Sách Công Việc Có Bộ Hẹn Giờ
1 Tổng Quan Dự Án
2 Tạo Ứng Dụng Chuyển Đổi Tiền Tệ (Phần 1)
3 Tạo Ứng Dụng Chuyển Đổi Tiền Tệ (Phần 2)
4 Tạo Ứng Dụng Chuyển Đổi Tiền Tệ (Phần 3)
1 Tổng Quan Phần
2 Class vs Functional Components
3 Components, Instances, Elements
4 Rendering Là Gì
5 Virtual DOM Là Gì
6 Fiber Tree Là Gì
7 Sơ Đồ Rendering
8 Memoization
9 Commit Phase Là Gì
10 Cách Prop Key Hoạt Động
11 Batching State Updates
12 Mount & Unmount
13 Framework vs Library
1 Biến vs useState vs useRef
2 useRef Để Truy Cập Phần Tử
3 Tóm Tắt useRef
4 Cách Tạo Custom Hook
1 Thiết Lập Dự Án
2 Thiết Lập Các Trang Route
3 Cách Tạo Liên Kết Route
4 Cách NavLink Hoạt Động
5 Sự Khác Biệt Giữa Components và Pages
6 Đường Dẫn Tuyệt Đối vs Tương Đối
7 Cách Thứ Hai Để Render Component Trên Trang
8 Cách Component Outlet Hoạt Động
9 Cách Thuộc Tính Index Hoạt Động
10 Hook useParams
11 Render Có Điều Kiện: Sản Phẩm
12 Cách Hook useSearchParams Hoạt Động
13 Sử Dụng Query String Trong Dự Án
14 Cách Hook useLocation Hoạt Động
15 Cách Hook useNavigate Hoạt Động
16 Cách Component Hoạt Động
17 Thuộc Tính Link Bổ Sung
18 Link vs Navigate vs useNavigate
19 Cú Pháp Cũ vs Cú Pháp Mới
20 Thực Hành: React Router DOM
1 Tổng Quan Phần
2 Cách CSS Modules Hoạt Động
3 Thiết Lập Tailwind
4 Màu Sắc Trong Tailwind
5 Cách Tạo Bảng Màu Riêng
6 Làm Việc Với Văn Bản
7 Padding / Margin / Height / Width
8 Display & Khoảng Cách Con
9 Flexbox Trong Tailwind
10 Grid CSS Trong Tailwind
11 Định Vị Tuyệt Đối
12 Gradient & Tùy Chỉnh Theme
13 Kết Hợp Lớp Sử Dụng @apply
14 Tạo UI Components Thay Vì @apply
15 Đối Tượng Trạng Thái NavLink
16 Thêm Phông Chữ Tùy Chỉnh
17 Cách Thiết Kế Đáp Ứng Hoạt Động
18 Pseudo-classes và Lớp Group
19 Cách Lớp Peer Hoạt Động
20 Hoạt Ảnh Trong Tailwind
21 Cách Sử Dụng Plugins
22 Hoàn Thiện Dự Án
23 Hoàn Thiện Dự Án (Phần 2)
24 Hoàn Thiện Dự Án (Phần 3)
1 Tải Dữ Liệu Trước Router 6.4
2 Cách Tải Dữ Liệu Mới
3 Cách Xử Lý Lỗi Mới
4 useNavigation Cho Trạng Thái Tải
5 Gửi Dữ Liệu Với Action
6 Thực Hành: Tải Dữ Liệu Router (Phần 1)
7 Thực Hành: Tải Dữ Liệu Router (Phần 2)
8 Thực Hành: Tải Dữ Liệu Router (Phần 3)
1 Tổng Kết Kết Quả Khóa Học
2 Cách Context API Hoạt Động
3 Thực Hành: Context API Với Danh Sách Công Việc
4 Context API + Prop Children
5 Lỗi Nhỏ Bạn Có Thể Mắc Phải
6 Custom Hook Cho useContext
1 Cách Toán Tử Switch Hoạt Động
2 Triển Khai Biến Thể useState
3 Làm Quen Với Hook useReducer
4 useReducer Từng Bước
5 Payload Trong Dispatch
6 Đối tượng ở trạng thái ban đầu
7 Thêm logic useReducer
8 Thực hành: Hook useReducer
9 useReducer với tải dữ liệu (Phần 1)
10 useReducer với tải dữ liệu (Phần 2)
11 useReducer với tải dữ liệu (Phần 3)
12 useReducer với tải dữ liệu (Phần 4)
13 useReducer với tải dữ liệu (Phần 5)
1 Tổng quan dự án
2 Trạng thái ban đầu & Hàm Reducer
3 Store & Provider
4 Sử dụng hàm Dispatch
5 Hook useSelector
6 Tái cấu trúc hàm Action
7 Hành động xóa người dùng
8 Cách Redux Thunk hoạt động
9 Nhiều Reducer trong ứng dụng
1 Cài đặt Redux Toolkit
2 Tạo Store (JS)
3 Tạo Slice đầu tiên
4 Sử dụng Actions trong RTK
5 Thực hành: Thêm chức năng
6 Redux Dev Extension cho trình duyệt
7 Tải người dùng với createAsyncThunk
8 Xử lý lỗi với createAsyncThunk
9 Tính năng bổ sung của createAsyncThunk
10 Thực hành: Hoàn thiện ứng dụng
1 Công cụ phát triển: Profiler
2 Cách hoạt động của hook useMemo
3 Cách hoạt động của hook useCallback
4 Prop Children bên trong hàm Memo
5 Tải chậm (Lazy Loading)
6 Suspense để hiển thị trạng thái tải
1 Băm hình ảnh (Image Hashing)
2 npm run build
3 Triển khai dự án
1 Hẹn gặp lại trong các bài học!

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

Welcome!

 

I’m excited to welcome you to the complete course on the most popular and in-demand library for Front-End web development — React JS.

 

Inside the course, you will find:

 

  • The entire native React — from the very basics to advanced concepts, step by step together with the instructor.

  • A complete study of the key libraries of the React ecosystem — React Redux and React Router, including the latest syntax and modern development standards.

  • Over 200 video lessons covering all the nuances of building web applications with React.

  • More than 13 hands-on assignments for self-practice on each course topic.

  • Over 100 self-check quizzes to help reinforce your knowledge.

  • An author’s interactive workbook — a textbook with more than 270 pages.

  • A bonus module on development with neural networks.

  • Instructor support and daily answers to all your questions.

 

Full understanding of React JS / React Redux / React Router

In this course, we will dive into how React works under the hood, so that you understand its logic and philosophy, not just memorize methods and functions.

 

A Modern React JS Course

Unlike many courses based on outdated versions of React, this course introduces you to the most modern development standards, the new syntax including React 19 (December 5, 2024), and the latest updates of React Redux and React Router, including Redux Toolkit and React Router 6.4+.

 

Free Workbook — Course Companion

To support your learning, I’ve created a detailed interactive workbook of more than 270 pages, which brings together all the methods and techniques of React JS and its ecosystem libraries.

This workbook is my special pride. It contains hundreds of examples explaining all the nuances of working with React and its libraries in a clear and accessible way.

 

Full Tailwind CSS Course

Additionally, as a bonus, we will study the most modern and in-demand framework for styling web applications — Tailwind CSS, which will allow you to bring any design solutions in your projects to life.

 

Practice, Practice, and More Practice

This course is fully practice-based. Every topic is learned in the process of developing multiple projects — from tabs, toggles, and modal windows to task planners, currency converters, and even an online store.

 

JavaScript Essentials Included

To take this course, you need basic knowledge of HTML, CSS, and JavaScript.

If you are not confident in your JavaScript skills, the course includes a dedicated module for revising everything you need from native JavaScript.

 

Daily Answers from the Instructor

And of course, if you have questions, you can always ask me. I answer all students every day, without exceptions.

All practical assignments come with answers and detailed explanations.

 

Neural Networks Module as a Gift

We will also cover modern development methods, including building applications with neural networks.

 

So, what is the Foundation School?

 

Foundation is a unique teaching methodology — from simple to complex.

Thousands of students around the world have already appreciated our approach. The average course rating from more than 9,000 students is 4.82 out of 5, which is among the best results across all online courses.

 

Try the modern learning format with Foundation, and you won’t want to study any other way.

 

 

See you in class!

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 Frontend Development
Hiển thị tất cả khoá học Javascript
Hiển thị tất cả khoá học React
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 😊