Ưu đãi trong tuần: Nhập mã UD50 giảm 50k cho đơn từ 300k!
Trang chủ
Đăng nhập
Xem tất cả kết quả
Menu
Đăng nhập Đăng ký miễn phí

React JS Web Development 2025 + Next.Js 15: Complete Course

Phát triển Web với React JS 2025 + Next.Js 15: Khóa học Toàn diện

Phát triển Web với React JS 2025 + Next.Js 15: Khóa học Toàn diện

Bộ đôi Hoàn chỉnh React + Next.js 15: Học React từ Cơ bản đến Nâng cao, TypeScript và Ứng dụng Full-Stack với Next.Js

4.4
(93 đánh giá)
867 học viên
Giảng viên
Ivan Lourenço Gomes
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
21.0 giờ video
199 bài giảng
4 bài quiz
4 bài coding
Truy cập vĩnh viễn
Học trên mọi thiết bị
Cập nhật: 30/05/2026
#Frontend Development #Next Js #React #Web Development

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

REACT JS Toàn tập: Từ Cơ bản đến Nâng cao
NEXT.js 15 Toàn tập với App Router
React Hiện đại với Hooks & Function Components
Context API & Reducers
Quản lý State với REDUX Toolkit cho Ứng dụng Quy mô Lớn
Định tuyến Toàn diện với REACT ROUTER
Tích hợp FIREBASE cho Cơ sở dữ liệu Thời gian thực & Hosting
Thao tác CRUD với React & Cơ sở dữ liệu Firestore
Triển khai Tự động Firebase với Github
TYPESCRIPT cho Phát triển Không lỗi
Triển khai TYPESCRIPT trên Dự án React Mới và Hiện có
Tạo Ứng dụng Web Full-Stack với NEXT.JS

Yêu cầu

Máy tính có kết nối internet
Nên có kiến thức quen thuộc về HTML & CSS và JavaScript cơ bản
Học viên không cần có kiến thức trước về React hay framework khác, khóa học bắt đầu từ con số 0 và bao quát mọi chủ đề để thành thạo React

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

Nhà phát triển web đầy khát vọng tìm điểm khởi đầu với React. Bạn sẽ đi từ số 0 trở thành một lập trình viên React tự tin.
Lập trình viên có kinh nghiệm muốn nâng cấp: Nếu bạn đã là developer nhưng muốn nâng cao kỹ năng với React nâng cao, khóa học này cung cấp các chủ đề nâng cao với dự án thực tế.
Sinh viên và người đam mê công nghệ muốn lao vào thế giới phát triển web hiện đại sử dụng React.
Doanh nhân và Người sáng lập Start-up muốn xây dựng doanh nghiệp dựa trên web

Nội dung khóa học

18 phần • 199 bài giảng
1 Chuẩn bị Không gian Làm việc
2 JSX Cơ bản
3 Render Danh sách với Hàm Map
4 Hướng dẫn Bài tập Thực hành
5 Render Có điều kiện
6 Components
7 Hiển thị hoặc Ẩn Tóm tắt Đơn hàng
8 Props
9 Sự kiện
10 State
11 React Hooks
12 Cập nhật Biến State
13 Cập nhật Chi tiết Đơn hàng
14 Xử lý Số lượng
1 Giới thiệu Dự án To-Do
2 Mã SCSS cho Bài học Tiếp theo
3 CSS vs SCSS
4 Kiểu cho Component
5 CSS Modules
6 TÓM TẮT: Sử dụng CSS Modules
7 Mẹo Làm việc với CSS Modules
1 Quản lý State trên Ứng dụng Quy mô Lớn
2 Mảng To-Do cho Bài học Tiếp theo
3 Tạo To-Do Giả và Render Danh sách
4 Thiết lập Logic để Xóa và Đánh dấu To-Do là Đã xong
5 Tạo và Cung cấp To-Dos Context
6 Sử dụng Context từ Components Con
7 Reducers - Hợp nhất Logic State
8 Sử dụng Hàm Reducer
9 TÓM TẮT: Reducers
10 Dispatch Actions Trực tiếp từ Component To-Do
11 Di chuyển Logic Context vào Component Context Provider
12 Kết hợp Reducer vào Context
13 TÓM TẮT: Context + Reducers
14 Mã HTML & CSS cho Modal Thêm To-Do
15 Modal Thêm To-Do
16 Mở & Đóng Modal với State
17 Logic Thêm To-Do
18 Thêm ID cho To-Do Mới
19 Logic Lọc
20 Hiển thị To-Do Đã lọc
21 Lưu To-Do trong LocalStorage
1 Giới thiệu Dự án Danh sách Sách
2 Bắt đầu với React Router
3 Thêm Liên kết với React Router
4 Liên kết Động và Tham số URL
5 Thêm Liên kết đến Từng Cuốn sách
6 Điều hướng đến Liên kết Theo chương trình với useNavigate
1 Redux - Quản lý State cho Ứng dụng Quy mô Lớn
2 Cài đặt Redux và Thiết lập Store
3 Đọc từ State với Hook useSelector
4 Gọi Hàm Reducer Với Hook useDispatch
5 Tránh Lỗi Nghiêm trọng cho Book Id Không tồn tại
6 Chuyển đổi State isRead
7 Hành động addBook
8 Slice Notes
9 Lọc Notes theo Book ID
10 Xóa Notes
11 Thêm Notes
12 Xóa Tất cả Book Notes
1 React và Firebase - Giới thiệu Dự án
2 Thiết lập Dự án Firebase
3 Phương thức Xác thực Firebase
4 Đăng ký Người dùng Mới
5 Xử lý Lỗi Đăng ký
6 Đăng nhập Người dùng Hiện có
7 Hàm Đặt lại Mật khẩu
8 Hiển thị Trang chủ cho Người dùng Đã đăng nhập
9 Duy trì Trạng thái Đăng nhập trong Phiên trình duyệt
10 Hàm Đăng xuất
11 Thêm Loader vào Trang Đăng nhập
1 Thiết lập Cơ sở dữ liệu Firestore
2 Đọc TỪ Cơ sở dữ liệu Firestore
3 Sử dụng Mệnh đề WHERE trên Truy vấn Firebase
4 Chúng ta Có Thực sự Cần Redux trong Dự án này Không?
5 Hàm Bất đồng bộ trong Redux với createAsyncThunk
6 ExtraReducers và Đối tượng Builder
7 Cập nhật Dữ liệu TỪ Firestore - Thuộc tính isRead
8 Chuyển đổi isRead từ Trang Sách Đơn lẻ
9 Xóa Documents khỏi Firestore
10 Tạo Documents trong Firestore
11 Sửa lỗi trong Luồng Thêm Sách
12 Thêm Loader cho Hành động Đang chờ
13 Trang Sách Đơn: Tìm nạp Sách Theo yêu cầu
14 Cải thiện Trạng thái Tải của Trang Sách Đơn
15 Tìm nạp Book Notes
16 Xóa Book Notes
17 Thêm Notes
18 Dọn dẹp Dự án
19 Điều chỉnh Quy tắc Bảo mật trong Cơ sở dữ liệu Firestore của Firebase
1 Firebase Hosting
2 Thêm Tên miền .com Tùy chỉnh vào Dự án Firebase của bạn
3 Thiết lập Kho Github
4 Mẹo GIT cho Người mới bắt đầu
5 Thiết lập Tích hợp Github với Firebase
6 Tầm quan trọng của Branches
7 Triển khai Feature Branches với Pull Requests
1 TypeScript là gì?
2 Chuẩn bị Không gian Làm việc
3 TSC: Trình biên dịch TypeScript
4 Cú pháp TypeScript
5 Kiểu dữ liệu Nguyên thủy & Hàm
6 Mảng
7 Đối tượng và Bí danh Kiểu
8 Thuộc tính Tùy chọn
9 Giao diện
10 Kiểu Hợp và Kiểu Chữ
11 Null & Undefined
12 Kiểu Any
13 Phần tử HTML và Khẳng định Kiểu
1 Giới thiệu Dự án Sinh viên
2 Định nghĩa Giao diện Student
3 Xuất Tên & Tuổi của Sinh viên
4 Viết Logic cho Lĩnh vực Trọng tâm
5 Xuất Trạng thái của Sinh viên
6 Hàm Refresh Table Có thể tái sử dụng
1 Tạo Dự án React & TypeScript Đầu tiên của bạn
2 Thêm về Quy tắc Tsconfig Mặc định
3 Gõ kiểu Biến State
4 Gõ kiểu Props
5 Chia sẻ Kiểu giữa các Components
6 Gõ kiểu Hàm
1 Giới thiệu Ứng dụng Đố vui
2 Tạo Context
3 Cung cấp Context
4 Thêm Hàm Reducer vào Context
5 Điều chỉnh Kiểu Context
6 Tìm nạp Câu hỏi Từ API Open Trivia
7 Tạo Giao diện Câu hỏi với Chat GPT
8 Render Giao diện Dựa trên Trạng thái Trò chơi
9 Thêm Câu hỏi vào Context
10 Xáo trộn Câu trả lời Đúng và Sai
11 Giải mã Thực thể HTML trên Câu hỏi
12 Thu thập Câu trả lời của Người dùng
13 Gửi Câu trả lời của Người dùng
14 Hiển thị Kết quả cho Người dùng
15 Hiển thị Câu hỏi Tiếp theo cho Lối chơi Vô hạn
16 Thêm Điểm số vào Context
17 Thiết lập Âm thanh và Confetti cho Câu trả lời Đúng
1 Giới thiệu Next.js & Trình bày Dự án
2 Thiết lập Ứng dụng Next.js Mới
3 Cài đặt Tiện ích mở rộng ES7+ React và JavaScript Nightly trong VS Code
4 Hiểu Cấu trúc Thư mục Next.js
5 Làm việc với Component Layout
6 Định dạng Dự án Next.js Sử dụng CSS Modules
7 Hướng dẫn Xây dựng Components Tùy chỉnh
8 Thiết lập CSS cho Dự án
9 Định dạng Phần Header
10 Sử dụng Nhiều Lớp CSS Module Cùng nhau
11 Sử dụng Component Image của Next.js
12 Sử dụng Component Link của Next.js
13 Thêm Phông chữ Google vào Dự án
14 Hoàn thiện Định dạng Trang chủ
1 Lấy Dữ liệu trong Next.js
2 Thiết kế Components Thẻ Sản phẩm
3 Cấu hình Tên miền Hình ảnh Từ xa Được phép
4 Xử lý Tham số Đường dẫn Động
5 Tạo Trang Chi tiết Sản phẩm
1 Client Components vs. Server Components
2 Quản lý State trong Ứng dụng Next.js
3 Context API: Tạo và Cung cấp Context
4 Truy cập Dữ liệu từ Context
5 Xây dựng Component Bộ đếm Túi
6 Cập nhật (Thay đổi) State Ứng dụng
7 Xóa sản phẩm khỏi giỏ hàng
8 Cấu trúc HTML cho bộ điều khiển số lượng
9 Triển khai logic thay đổi số lượng sản phẩm
10 Điều chỉnh số lượng trong giỏ hàng
11 Cấu trúc HTML cho thành phần mục giỏ hàng
12 Tạo trang Giỏ hàng
13 Sử dụng Context bên trong trang Giỏ hàng
14 Hiển thị các mục giỏ hàng lên màn hình
15 Chuẩn bị trình xử lý hành động cho sản phẩm
16 Tính tổng tiền đơn hàng
17 Viết hàm tiện ích định dạng giá
18 Triển khai tính năng "Xóa toàn bộ giỏ hàng"
19 Lưu trữ mục giỏ hàng bằng Local Storage
1 Quản lý lỗi trong ứng dụng Next.js
2 Làm việc với tệp route error.js
3 Tạo kiểu và cá nhân hóa trang lỗi
4 Sử dụng Error Boundaries để bắt lỗi component
5 Tái cấu trúc Sản phẩm và Danh mục thành các component nhỏ hơn
6 Tùy chỉnh màn hình 404 Không tìm thấy
7 Tìm hiểu tệp loading.js cho các route
8 Thêm trạng thái tải cho component với React Suspense
1 Xây dựng cấu trúc trang Sản phẩm
2 Triển khai trạng thái tải & lỗi cho trang Sản phẩm
3 Tạo danh sách sản phẩm phân trang
4 Tải thêm sản phẩm khi được yêu cầu
5 Cấu hình trạng thái tải và lỗi cho danh sách phân trang
6 Thêm tham số URL để lọc theo danh mục
7 Lấy sản phẩm theo danh mục đã chọn
8 Triển khai giao diện bộ lọc danh mục
9 Cập nhật sản phẩm khi thay đổi danh mục
1 Thiết lập kho lưu trữ Git cho dự án
2 Cách triển khai ứng dụng Next.js trên Vercel
3 Cập nhật trang web và triển khai phiên bản mới
4 Phát hành tính năng mới trong môi trường xem trước
5 Khôi phục bản triển khai trên Vercel

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

Welcome to the REACT JS Complete Course 2025 Edition, Including TypeScript, Firebase & Next.js - your gateway to becoming a React Developer in the ever-evolving world of web development!

In today's tech landscape, mastering React is not just a skill; it's a career advantage. This comprehensive course takes you on a journey from React novice to a seasoned expert developer, equipping you with the tools and techniques demanded by today's industry.

Why Choose This Course:

In a crowded field of React courses, ours stands out for several compelling reasons:

  • From Zero to Mastery: We begin from the basics, making it accessible for beginners, and progress seamlessly into advanced topics, ensuring seasoned developers also gain valuable insights.

  • The Modern Approach to React: Function components & hooks.

  • Context & Reducers Demystified: Complex concepts like context and reducers are made crystal clear, giving you a deep understanding of state management in React.

  • Redux Toolkit for Effortless State Management: Learn how to streamline state management with Redux Toolkit, a must-know skill for any React developer.

  • Firebase for Real-world Applications: Dive into Firebase to master user authentication, Firestore database integration & CRUD, and deployment, making you proficient in building real-world, scalable apps.

  • TypeScript Integration: Stay ahead in the game by integrating TypeScript into your React projects, enhancing your code quality and collaboration potential.

  • Next.js for Modern Full-Stack Development: Build high-performance, SEO-optimized, production-ready applications using the latest App Router architecture. Master data fetching, dynamic routing, server vs. client components, error handling, Suspense, and deployment workflows on Vercel, the exact setup used by top engineering teams today.

How Will This Course Benefit You:

Whether you're a beginner developer or an experienced professional seeking to upgrade your skills, this course empowers you with:

  • Career-Ready Skills: Equip yourself with the tools and knowledge required for high-demand React developer positions.

  • Portfolio-Building Projects: Gain practical experience through hands-on projects, with real-time databases and custom domains.

  • Confidence in Complex Concepts: Tackle advanced concepts like state management and authentication with confidence.

  • Industry Insights: Benefit from real-world insights and best practices accumulated from years of industry experience.

Who Should Enroll:

  • Aspiring Developers: If you're new to React, this course provides a solid foundation.

  • Experienced Developers: Seasoned devs will benefit from advanced topics and best practices.

  • Professionals Seeking Career Growth: Upgrade your skills and open doors to better job opportunities.

Don't miss out on this chance to master React and stay ahead in your web development journey. Enroll now and join our thriving community of React experts. Let's build amazing web applications together!

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 Next Js
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 😊