Next.js 15 & React – The Complete Guide
About Course
Nội dung bài học
- Learn how to build fullstack React apps with NextJS 15 & the App Router
- Build real projects and apply what you learned with hands-on projects and examples
- Learn about different ways of building NextJS app – App Router vs Pages Router
- Get started with React Server Components, Client Components, data fetching & more!
- Handle data submissions via Server Actions
- Learn all key NextJS features like pre-rendering, SSR, data fetching, file-based routing and authentication
- Take the full course or the “NextJS Summary” module for a quickstart if you have limited time
Course Content
01 – Getting Started
- 01:20
- 02:20
- 02:40
- 04:25
- 02:30
- 02:21
- 02:29
- 03:05
02 – Optional React Refresher
- 01:08
- 05:37
- 02:09
- 03:27
- 03:28
- 07:46
- 11:15
- 05:03
- 06:00
- 06:15
- 10:07
- 06:31
- 03:46
- 07:52
- 10:00
- 09:08
- 07:21
- 08:59
- 07:51
- 03:34
- 06:19
- 05:30
- 06:39
- 06:10
- 04:12
- 09:06
- 04:23
- 03:55
- 05:36
- 04:08
- 05:36
- 08:09
- 09:07
- 11:08
- 08:41
- 01:25
- 01:27
- 03:48
- 07:25
- 02:00
- 03:06
- 08:15
- 03:04
- 06:31
- 07:36
- 05:34
- 07:19
- 05:17
- 06:40
- 05:40
- 08:19
- 07:08
- 16:52
- 05:21
- 05:45
- 05:50
- 09:48
- 08:39
- 08:58
- 09:45
- 06:52
- 05:18
- 03:42
- 09:25
- 10:08
- 11:02
- 05:54
- 12:10
- 06:54
- 01:00
03 – NextJS Essentials (App Router)
- 01:20
- 02:32
- 02:45
- 03:06
- 04:12
- 03:22
- 06:31
- 06:17
- 01:24
- 02:03
- 08:19
- 03:50
- 05:58
- 06:00
- 04:57
- 03:48
- 04:18
- 03:25
- 08:15
- 11:07
- 10:31
- 03:11
- 07:17
- 04:00
- 05:54
- 05:22
- 01:57
- 11:04
- 02:03
- 01:53
- 08:28
- 06:00
- 09:02
- 03:45
- 03:20
- 12:56
- 05:30
- 05:54
- 08:05
- 06:06
- 03:57
- 02:13
- 03:47
- 02:20
- 04:25
04 – Routing & Page Rendering – Deep Dive
- 01:37
- 04:17
- 07:17
- 04:56
- 08:59
- 04:39
- 06:40
- 12:50
- 06:01
- 09:21
- 03:38
- 03:02
- 10:10
- 04:56
- 05:11
- 07:42
- 02:42
- 06:39
- 05:15
- 05:40
- 00:30
05 – Data Fetching – Deep Dive
- 00:56
- 02:46
- 08:50
- 05:36
- 06:14
- 04:50
- 13:19
- 11:35
06 – Mutating Data – Deep Dive
- 01:11
- 05:46
- 09:19
- 04:16
- 04:39
- 06:04
- 09:57
- 07:40
- 03:57
- 08:13
- 11:00
- 04:45
- 11:42
- 06:13
07 – Understanding & Configuring Caching
- 01:09
- 05:13
- 01:45
- 05:31
- 05:50
- 05:27
- 04:42
- 06:03
- 07:15
- 03:44
- 03:32
- 01:44
08 – NextJS App Optimizations
- 03:08
- 03:43
- 05:15
- 04:45
- 03:03
- 04:12
- 03:03
- 15:51
- 01:04
- 02:57
- 05:03
- 01:38
09 – User Authentication
- 01:04
- 03:26
- 14:35
- 04:30
- 02:07
- 05:01
- 05:21
- 02:54
- 04:32
- 04:51
- 03:44
- 07:15
- 03:07
- 05:35
- 05:34
- 03:44
- 03:41
- 04:10
10 – Roundup & Next Steps
11 – Pages & File-based Routing
- 01:40
- 01:12
- 01:19
- 05:22
- 04:01
- 01:34
- 03:33
- 04:54
- 04:54
- 07:12
- 05:44
- 05:44
- 03:41
- 02:55
- 03:50
- 01:35
- 05:51
12 – Project Time Working with File-based Routing
- 02:04
- 04:15
- 07:35
- 04:46
- 07:14
- 10:22
- 09:28
- 08:26
- 08:31
- 06:27
- 02:05
- 08:25
- 08:25
- 08:54
- 07:02
- 01:40
13 – Page Pre-Rendering & Data Fetching
- 02:25
- 05:15
- 05:38
- 04:04
- 03:08
- 06:39
- 07:41
- 05:20
- 07:22
- 03:45
- 04:20
- 09:46
- 03:44
- 03:27
- 03:59
- 05:27
- 04:02
- 05:53
- 04:14
- 04:05
- 04:20
- 04:04
- 03:25
- 03:40
- 14:47
- 08:58
- 08:55
- 06:45
14 – Project Time Page Pre-rendering & Data Fetching
- 01:04
- 05:01
- 11:02
- 09:50
- 07:47
- 02:47
- 09:52
- 10:55
- 01:30
15 – Optimizing NextJS Apps
- 01:19
- 01:49
- 03:41
- 05:17
- 04:22
- 03:04
- 03:17
- 05:31
- 01:59
- 08:37
- 00:51
- 01:16
16 – Adding Backend Code with API Routes (Fullstack React)
- 00:51
- 05:38
- 08:24
- 06:29
- 10:16
- 05:43
- 07:56
- 08:04
- 13:41
- 05:09
- 01:44
17 – Project Time API Routes
- 01:31
- 05:15
- 11:10
- 08:43
- 10:59
- 05:42
- 09:14
- 06:26
- 04:31
- 07:33
- 10:48
- 01:45
18 – Working with App-wide State (React Context)
- 01:27
- 04:32
- 05:37
- 03:49
- 04:37
- 06:35
- 06:31
- 07:22
- 01:09
19 – Complete App Example Build a Full Blog A to Z
- 03:00
- 05:10
- 05:29
- 08:47
- 08:45
- 03:18
- 05:47
- 09:41
- 12:25
- 03:59
- 10:10
- 02:30
- 07:32
- 13:40
- 08:19
- 11:42
- 12:46
- 06:29
- 04:18
- 04:26
- 07:26
- 08:52
- 15:05
- 06:52
- 02:55
- 03:45
- 01:24
20 – Deploying NextJS Apps
- 01:17
- 08:05
- 03:06
- 03:11
- 14:26
- 07:21
- 17:40
- 01:57
- 02:16
- 00:38
21 – Adding Authentication
- 01:16
- 01:45
- 14:23
- 03:04
- 12:59
- 09:41
- 03:00
- 14:08
- 06:52
- 05:57
- 02:18
- 07:50
- 07:41
- 05:46
- 05:14
- 03:42
- 06:37
- 10:36
- 09:16
- 03:29
22 – Optional NextJS Summary
- 03:03
- 04:45
- 06:38
- 03:13
- 01:50
- 06:14
- 02:47
- 02:52
- 06:06
- 03:47
- 03:36
- 04:07
- 07:13
- 03:32
- 03:42
- 05:04
- 03:55
- 06:17
- 03:47
- 10:00
- 05:52
- 08:56
- 05:44
- 06:27
- 05:14
- 07:16
- 06:21
- 09:32
- 06:49
01 – Getting Started
- 01:20
- 02:20
- 02:40
- 04:25
- 02:30
- 02:21
- 02:29
- 03:05
02 – Optional React Refresher
- 01:08
- 05:37
- 02:09
- 03:27
- 03:28
- 07:46
- 11:15
- 05:03
- 06:00
- 06:15
- 10:07
- 06:31
- 03:46
- 07:52
- 10:00
- 09:08
- 07:21
- 08:59
- 07:51
- 03:34
- 06:19
- 05:30
- 06:39
- 06:10
- 04:12
- 09:06
- 04:23
- 03:55
- 05:36
- 04:08
- 05:36
- 08:09
- 09:07
- 11:08
- 08:41
- 01:25
- 01:27
- 03:48
- 07:25
- 02:00
- 03:06
- 08:15
- 03:04
- 06:31
- 07:36
- 05:34
- 07:19
- 05:17
- 06:40
- 05:40
- 08:19
- 07:08
- 16:52
- 05:21
- 05:45
- 05:50
- 09:48
- 08:39
- 08:58
- 09:45
- 06:52
- 05:18
- 03:42
- 09:25
- 10:08
- 11:02
- 05:54
- 12:10
- 06:54
- 01:00
03 – NextJS Essentials (App Router)
- 01:20
- 02:32
- 02:45
- 03:06
- 04:12
- 03:22
- 06:31
- 06:17
- 01:24
- 02:03
- 08:19
- 03:50
- 05:58
- 06:00
- 04:57
- 03:48
- 04:18
- 03:25
- 08:15
- 11:07
- 10:31
- 03:11
- 07:17
- 04:00
- 05:54
- 05:22
- 01:57
- 11:04
- 02:03
- 01:53
- 08:28
- 06:00
- 09:02
- 03:45
- 03:20
- 12:56
- 05:30
- 05:54
- 08:05
- 06:06
- 03:57
- 02:13
- 03:47
- 02:20
- 04:25
04 – Routing & Page Rendering – Deep Dive
- 01:37
- 04:17
- 07:17
- 04:56
- 08:59
- 04:39
- 06:40
- 12:50
- 06:01
- 09:21
- 03:38
- 03:02
- 10:10
- 04:56
- 05:11
- 07:42
- 02:42
- 06:39
- 05:15
- 05:40
- 00:30
05 – Data Fetching – Deep Dive
- 00:56
- 02:46
- 08:50
- 05:36
- 06:14
- 04:50
- 13:19
- 11:35
06 – Mutating Data – Deep Dive
- 01:11
- 05:46
- 09:19
- 04:16
- 04:39
- 06:04
- 09:57
- 07:40
- 03:57
- 08:13
- 11:00
- 04:45
- 11:42
- 06:13
07 – Understanding & Configuring Caching
- 01:09
- 05:13
- 01:45
- 05:31
- 05:50
- 05:27
- 04:42
- 06:03
- 07:15
- 03:44
- 03:32
- 01:44
08 – NextJS App Optimizations
- 03:08
- 03:43
- 05:15
- 04:45
- 03:03
- 04:12
- 03:03
- 15:51
- 01:04
- 02:57
- 05:03
- 01:38
09 – User Authentication
- 01:04
- 03:26
- 14:35
- 04:30
- 02:07
- 05:01
- 05:21
- 02:54
- 04:32
- 04:51
- 03:44
- 07:15
- 03:07
- 05:35
- 05:34
- 03:44
- 03:41
- 04:10
10 – Roundup & Next Steps
11 – Pages & File-based Routing
- 01:40
- 01:12
- 01:19
- 05:22
- 04:01
- 01:34
- 03:33
- 04:54
- 04:54
- 07:12
- 05:44
- 05:44
- 03:41
- 02:55
- 03:50
- 01:35
- 05:51
12 – Project Time Working with File-based Routing
- 02:04
- 04:15
- 07:35
- 04:46
- 07:14
- 10:22
- 09:28
- 08:26
- 08:31
- 06:27
- 02:05
- 08:25
- 08:25
- 08:54
- 07:02
- 01:40
13 – Page Pre-Rendering & Data Fetching
- 02:25
- 05:15
- 05:38
- 04:04
- 03:08
- 06:39
- 07:41
- 05:20
- 07:22
- 03:45
- 04:20
- 09:46
- 03:44
- 03:27
- 03:59
- 05:27
- 04:02
- 05:53
- 04:14
- 04:05
- 04:20
- 04:04
- 03:25
- 03:40
- 14:47
- 08:58
- 08:55
- 06:45
14 – Project Time Page Pre-rendering & Data Fetching
- 01:04
- 05:01
- 11:02
- 09:50
- 07:47
- 02:47
- 09:52
- 10:55
- 01:30
15 – Optimizing NextJS Apps
- 01:19
- 01:49
- 03:41
- 05:17
- 04:22
- 03:04
- 03:17
- 05:31
- 01:59
- 08:37
- 00:51
- 01:16
16 – Adding Backend Code with API Routes (Fullstack React)
- 00:51
- 05:38
- 08:24
- 06:29
- 10:16
- 05:43
- 07:56
- 08:04
- 13:41
- 05:09
- 01:44
17 – Project Time API Routes
- 01:31
- 05:15
- 11:10
- 08:43
- 10:59
- 05:42
- 09:14
- 06:26
- 04:31
- 07:33
- 10:48
- 01:45
18 – Working with App-wide State (React Context)
- 01:27
- 04:32
- 05:37
- 03:49
- 04:37
- 06:35
- 06:31
- 07:22
- 01:09
19 – Complete App Example Build a Full Blog A to Z
- 03:00
- 05:10
- 05:29
- 08:47
- 08:45
- 03:18
- 05:47
- 09:41
- 12:25
- 03:59
- 10:10
- 02:30
- 07:32
- 13:40
- 08:19
- 11:42
- 12:46
- 06:29
- 04:18
- 04:26
- 07:26
- 08:52
- 15:05
- 06:52
- 02:55
- 03:45
- 01:24
20 – Deploying NextJS Apps
- 01:17
- 08:05
- 03:06
- 03:11
- 14:26
- 07:21
- 17:40
- 01:57
- 02:16
- 00:38
21 – Adding Authentication
- 01:16
- 01:45
- 14:23
- 03:04
- 12:59
- 09:41
- 03:00
- 14:08
- 06:52
- 05:57
- 02:18
- 07:50
- 07:41
- 05:46
- 05:14
- 03:42
- 06:37
- 10:36
- 09:16
- 03:29
22 – Optional NextJS Summary
- 03:03
- 04:45
- 06:38
- 03:13
- 01:50
- 06:14
- 02:47
- 02:52
- 06:06
- 03:47
- 03:36
- 04:07
- 07:13
- 03:32
- 03:42
- 05:04
- 03:55
- 06:17
- 03:47
- 10:00
- 05:52
- 08:56
- 05:44
- 06:27
- 05:14
- 07:16
- 06:21
- 09:32
- 06:49
