0Pricing
Next.js 15 Fullstack (App Router + Server Actions) icon

Next.js 15 Fullstack (App Router + Server Actions)

TYPESCRIPTWebFrontendBackend

使用 Next.js 15 掌握全栈网页开发,充分利用 App Router 和 Server Actions 构建高性能、可扩展的应用程序。

🤖 AI 驱动📚 22 门课程👥 10万+ 学习者⭐ 4.9 分
课程概览

使用 Next.js 15 构建生产级网页应用

Next.js 15 是各种规模公司在生产环境中使用的 React 框架——它提供 App Router、Server Actions 和 Partial Prerendering 作为一级特性,让单个代码库可以处理路由、数据获取、身份验证和部署,无需依赖独立后端。本课程涵盖全部内容,从您的第一个基于文件的路由到运营多租户 SaaS 应用。

您将学到什么

您将从头开始使用 App Router 构建应用,区分 Client Component 和 Server Component 并知道何时使用各自,编写 Route Handler 和边缘就绪的 API 端点,以及处理带验证和乐观 UX 的表单。数据获取、缓存和重新验证的内部机制将与 Server Actions、数据库集成、身份验证和授权一起深入讲解。后续课程涉及使用 Suspense 的流式 UI 和 Partial Prerendering、国际化和本地化路由、使用 WebSocket 的实时应用、可观测性和错误边界,以及通过构建管道的包优化。

学习路径

二十二门课程从 A1 到 C2 逐级递进。课程开始于 Next.js 15 Foundations 和 App Router Essentials,在 B1 和 B2 阶段深入 Testing Next.js Applications、Caching & Revalidation Internals 和 Deployment & Real-world Project,随后在 C1 阶段进阶至 Advanced Server Actions、Performance & Optimization 和 Real-Time Apps with Streaming & WebSockets。课程在 C2 阶段以 Multi-Tenant SaaS Architecture 和 Build Pipeline & Bundle Optimization 作为收尾。

工作原理

每门课程分为短小实践课,您可以在内置编辑器中完成,获得实时反馈,遇到困难时可以与 AI 导师互动。所有代码都运行在真实的 Next.js 15 环境中——不是沙箱虚拟环境。

开始学习 →

你的学习方式

🎯
互动课程
实时反馈的动手编程练习
🤖
AI 导师
遇到困难时立即获得 AI 帮助
💻
内置编辑器
直接在浏览器中编写并运行代码
🏆
证书
完成课程后获得证书
课程

22 门课程

Next.js 15 Fullstack (App Router + Server Actions) 学习路径中的所有课程。

01

Next.js 15 基础

A14 节课

开始学习 Next.js 15,理解其核心原则、项目设置以及基础的文件系统路由模型,为构建现代 Web 应用打下基础。

02

App Router 核心

A24 节课PRO

深入了解强大的 App Router,学习如何使用布局、页面和动态路由组织应用。探索如何借助 Suspense 边界处理加载状态和错误。

03

路由处理程序与边缘 API 设计

B14 节课PRO

使用 Next.js 路由处理程序,在 Node 和 Edge 运行时构建生产级 REST 与流式 API。

04

表单、验证与乐观用户体验

B14 节课PRO

掌握现代 Next.js 表单模式,结合服务器操作、useFormStatus 和乐观更新。

05

客户端与服务器组件

B14 节课PRO

掌握 Next.js 15 中 React 服务器组件和客户端组件带来的范式转变。理解在不同场景下如何选择和使用它们,以获得最佳性能和交互体验。

06

状态管理与上下文

B14 节课PRO

了解 Next.js 中的高级状态管理模式,包括利用 React Context、Zustand 或 Jotai 管理全局状态和局部状态。

07

Next.js 15 数据获取

B23 节课PRO

探索 Next.js 15 中的各种数据获取策略,包括服务器组件的数据获取,以及交互式用户界面的客户端数据获取。

08

服务器操作入门

B24 节课PRO

了解服务器操作的强大功能,学习如何直接从客户端组件处理服务器端数据变更。学习高效创建表单和更新数据。

09

使用 Next.js 集成数据库

B24 节课PRO

学习将 Next.js 全栈应用连接到数据库。本迷你课程涵盖使用 Prisma 等对象关系映射工具,以及执行增删改查操作。

10

身份验证与授权

B26 节课PRO

通过实施稳健的身份验证和授权策略,保护您的 Next.js 应用。探索 NextAuth.js 或自定义解决方案等选项。

11

测试 Next.js 应用

B24 节课PRO

学习从单元测试到端到端测试的各种测试方法,确保 Next.js 项目的可靠性和可维护性。

12

部署与真实项目

B24 节课PRO

将 Next.js 全栈应用部署到生产环境,并通过构建一个完整而复杂的真实项目,应用所学的全部概念。

13

缓存与重新验证内部机制

B24 节课PRO

理解并控制 Next.js 的四层缓存机制,实现正确且快速的数据更新。

14

使用 Suspense 与部分预渲染构建流式界面

B24 节课PRO

通过流式传输服务器组件并采用部分预渲染,实现快速的首次绘制。

15

国际化与本地化路由

B24 节课PRO

使用区域路由、翻译和利于 SEO 的元数据,构建多语言 Next.js 应用。

16

高级服务器操作

C13 节课PRO

通过实现乐观用户界面更新、处理复杂表单数据,以及直接在服务器上管理文件上传,提升您使用服务器操作的技能。

17

性能与优化

C14 节课PRO

掌握优化 Next.js 应用速度和用户体验的技术,涵盖图像、字体和打包资源的优化。

18

高级路由:并行路由与拦截路由

C14 节课PRO

使用并行插槽和路由拦截,组合复杂布局和模态流程。

19

使用流式传输与 WebSockets 构建实时应用

C14 节课PRO

使用 SSE、WebSockets 和外部实时服务,为 Next.js 添加实时数据、在线状态和人工智能流式传输。

20

可观测性、日志与错误边界

C14 节课PRO

使用结构化日志和追踪为 Next.js 应用添加监测能力,并在生产环境中实现可靠的错误处理。

21

多租户 SaaS 架构

C24 节课PRO

通过按租户路由、隔离和计费,设计安全的多租户 Next.js SaaS。

22

构建流程与打包优化

C24 节课PRO

通过打包分析、Turbopack 和模块策略,充分提升 Next.js 构建的生产性能。

常见问题

常见问题解答

Next.js 15 Fullstack (App Router + Server Actions) 课程免费吗?

免费。你可以免费开始 Next.js 15 Fullstack (App Router + Server Actions) 课程并完成它的所有互动课程。可选的 PRO 订阅解锁高级 AI 工具和可分享的证书。

学习 TYPESCRIPT 需要有先前的经验吗?

不需要。课程从基础开始,逐步进阶到更高难度的主题,所以即使你没有任何 TYPESCRIPT 基础也可以开始。

我在 CoddyKit 上怎样学习 TYPESCRIPT?

学以致用。简洁的互动课程将清晰的讲解与实时动手编程练习结合,24/7 AI 导师在你遇到困难时提供个性化帮助。

完成 Next.js 15 Fullstack (App Router + Server Actions) 后能获得证书吗?

可以。PRO 学员可以参加考试,获得 Next.js 15 Fullstack (App Router + Server Actions) 课程的可分享的完成证书,其中包含可验证的代码。

我能在手机上学习 TYPESCRIPT 吗?

可以。CoddyKit 支持网页版和原生 iOS、Android 应用,你可以在任何设备上学习 TYPESCRIPT,进度会自动同步。

立即开始 Next.js 15 Fullstack (App Router + Server Actions)

加入数千名学习者,通过 AI 驱动的课程掌握编程。

免费开始 →浏览所有课程