Giới Thiệu Khóa Học Next.js 14 & React - Hướng Dẫn Hoàn Chỉnh [Update Tháng 12-2023] [Mã - 6903 A]

Tìm hiểu NextJS 14 từ đầu và xây dựng các ứng dụng ReactJS + NextJS fullstack với App Router hoặc Pages Router!

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

✓ Tìm hiểu cách xây dựng các ứng dụng React fullstack với NextJS 14 và App Router.

✓ Xây dựng các project thực tế và áp dụng những gì bạn đã học được thông qua các dự án và ví dụ thực hành.

✓ Tìm hiểu về các cách khác nhau để xây dựng ứng dụng NextJS - App Router vs Pages Router.

✓ Bắt đầu với React Server Components, Client Components, data fetching và hơn thế nữa!

✓ Xử lý data submission thông qua Server Actions.

✓ Tìm hiểu tất cả các tính năng chính của NextJS như pre-rendering, SSR, data fetching, file-based routing và authentication.

✓ Tham gia full khóa học hoặc module "NextJS Summary" để bắt đầu nhanh nếu bạn có thời gian hạn chế.

Cập nhật tháng 12 năm 2023:

✓ Đã thêm một phần mới LỚN (bao gồm một project demo hoàn toàn mới) bao gồm chuyên sâu về NextJS 14 và "App Router"!

✓ Bao gồm React Server Components, Server Actions và hơn thế nữa.

✓ Bao gồm file upload & storage trên S3.

✓ Đã cập nhật hoàn toàn phần "React Refresher".

✓ Không cần có kiến ​​thức NextJS trước - Tôi sẽ giới thiệu cho bạn "App Router" là gì trong khóa học này!

Hãy tham gia khóa học NextJS bán chạy nhất này và tìm hiểu cách xây dựng các ứng dụng React rất năng động, siêu nhanh và sẵn sàng cho SEO với React & NextJS!

Khóa học này bao gồm cả "App Router" & "Pages Router" NextJS - hai cách tiếp cận khác nhau để xây dựng các ứng dụng fullstack với React! Và tất nhiên, bạn sẽ tìm hiểu hai cách tiếp cận này là gì, tại sao lại tồn tại hai cách tiếp cận khác nhau và cách thức hoạt động của mỗi cách tiếp cận!

Tôi đã tạo khóa học bán chạy nhất về React, bây giờ tôi rất vui mừng được chia sẻ NextJS này với bạn - một khóa học chuyên sâu về một React framework tuyệt vời cho phép bạn thực hiện bước tiếp theo với tư cách là một React developer và xây dựng các project thực tế, production-ready với React và Next.js!

Next.js  là production-ready, fullstack-capable framework cho ReactJS - thư viện JavaScript phổ biến nhất mà bạn có thể học hiện nay!

Quá nhiều từ thông dụng cho sở thích của bạn?

Đủ công bằng - nhưng thực sự, NextJS là một lựa chọn tuyệt vời để phát triển với tư cách là một React developer và đưa ứng dụng React của bạn lên một tầm cao mới !

Bởi vì NextJS đang phát triển nhanh chóng và do đó có nhu cầu cao. Và có những lý do chính đáng cho điều đó: NextJS cho phép bạn xây dựng các ứng dụng React với built-in server-side rendering và page pre-rendering. Xây dựng trải nghiệm người dùng tuyệt vời và ứng dụng React thân thiện với công cụ tìm kiếm (SEO!) chưa bao giờ dễ dàng hơn thế!

Ngoài ra, NextJS còn giúp việc xây dựng các ứng dụng React fullstack (frontend + backend code kết hợp trong một project) cũng cực kỳ dễ dàng! Trộn client-side và server-side code, đồng thời xây dựng một API dựa trên NodeJS song song với các frontend React app của bạn. Thật dễ dàng với NextJS!

Bạn muốn thêm authentication ? NextJS cũng đơn giản hóa điều đó và giúp việc đăng ký, đăng nhập và quản lý session của người dùng trở nên rất thuận tiện.

Khóa học này sẽ đưa bạn từ cấp độ NextJS mới bắt đầu đến cấp độ nâng cao một cách nhanh chóng!

Chúng ta sẽ bắt đầu từ những điều cơ bản nhất, không yêu cầu kiến ​​thức về NextJS và sau đó chúng ta sẽ đi sâu vào tất cả các tính năng cốt lõi tạo nên NextJS. Cả về mặt lý thuyết cũng như với nhiều dự án thực tế, nơi tất cả các khái niệm sẽ được áp dụng từng bước.

Đối với khóa học này, bạn sẽ cần có kiến ​​thức cơ bản về React, mặc dù khóa học này có kèm theo một module "React refresher" trong trường hợp đã lâu rồi bạn không làm việc với React.

Khóa học này cũng bao gồm một module "NextJS Summary" cho Pages router và module "NextJS Essentials" cho App router - cho phép bạn luôn quay lại khóa học trong tương lai và làm mới kiến ​​thức của mình mà không cần phải học lại toàn bộ khóa học. Hoặc bạn chỉ cần lấy các module summary đó (và tạm thời bỏ qua phần còn lại) để tìm hiểu về tất cả các tính năng cốt lõi trong thời gian ngắn nhất có thể.

Sau khi kết thúc khóa học này, bạn sẽ được chuẩn bị tốt để xây dựng các dự án NextJS của riêng mình ngay từ đầu và ứng tuyển vào các vị trí NextJS!

Cụ thể, khóa học này sẽ bao gồm:

✓ NextJS là gì? Và tại sao bạn lại sử dụng nó?

✓ Tại sao chỉ React (trong nhiều trường hợp) là không đủ?

✓ Tạo các dự án NextJS ngay từ đầu và hiểu các dự án này.

✓ Làm việc với file-based routing.

✓ Thêm các dynamic route và các catch-all route.

✓ Triển khai các form khác nhau của page pre-rendering và server-side rendering.

✓ Làm việc với data và thêm data fetching + pre-fetching vào các ứng dụng của bạn.

✓ Xử lý form submission với Server Actions.

✓ Xử lý File upload.

✓ Pre-generating dynamic và static pages.

✓ Thêm các optimization như metadata vào pages.

✓ Tối ưu hóa hình ảnh với NextJS Image component.

✓ Xây dựng các ứng dụng fullstack với API routes hoặc Server Actions.

✓ Quản lý app-wide state với React context (trong các ứng dụng NextJS).

✓ Thêm authentication vào các ứng dụng NextJS.

✓ Nhiều ứng dụng hoàn chỉnh nơi chúng tôi sẽ áp dụng tất cả các khái niệm cốt lõi này!

✓ Một module React.js refresher hoàn chỉnh (để tất cả chúng ta đều có cùng quan điểm).

✓ Một module NextJS summary để bạn có thể làm mới những gì đã học hoặc chỉ khám phá các tính năng cốt lõi một cách nhanh chóng.

✓ Và nhiều hơn nữa!

Tôi nóng lòng muốn bắt đầu cuộc hành trình này cùng với bạn! 

Mục lục:

✓ 01 - Bắt đầu.

✓ 02 - Tùy chọn: React Refresher.

✓ 03 - NextJS Essentials (App Router).

✓ 04 - Pages & File-based Routing.

✓ 05 - Project Time: Làm việc với File-based Routing.

✓ 06 - Page Pre-Rendering & Data Fetching.

✓ 07 - Project Time: Page Pre-rendering & Data Fetching.

✓ 08 - Tối ưu hóa các NextJS App.

✓ 09 - Thêm Backend Code với API Routes (Fullstack React).

✓ 10 - Project Time: API Routes.

✓ 11 - Làm việc với App-wide State (React Context).

✓ 12 - Ví dụ về ứng dụng hoàn chỉnh: Xây dựng một Full Blog từ A đến Z.

✓ 13 - Deploy các NextJS App.

✓ 14 - Add Authentication.

✓ 15 - Tùy chọn: NextJS Summary.

✓ 16 - Tóm tắt khóa học.

Khóa học này dành cho ai:

✓ Các React developer muốn thực hiện bước tiếp theo và xây dựng các ứng dụng React production-ready.

✓ Các React developer có mục tiêu xây dựng các ứng dụng React fullstack.

✓ Các Web developer nói chung, những người muốn làm việc với một trong những nhóm công nghệ phổ biến và có nhu cầu cao nhất.