Next.js #

Next.js 是一个基于 React 的全栈 Web 开发框架，由 Vercel 公司开发和维护。本教程将带你从零开始，循序渐进地掌握 Next.js 的所有核心知识。

text

基础入门 → 路由系统 → 页面布局 → 数据获取 → 渲染策略 → 样式处理 → API路由 → 优化 → 部署 → 最佳实践

二、教程目录 #

章节	内容	链接
路由基础	文件系统路由、Link组件、编程式导航	开始学习
动态路由	动态段、捕获所有路由、generateStaticParams	开始学习
路由组与并行路由	路由组织、并行路由、拦截路由	开始学习
中间件	请求拦截、认证保护、重定向	开始学习

章节	内容	链接
页面与布局基础	page.tsx、layout.tsx、嵌套布局	开始学习
模板与默认组件	template.tsx、default.tsx	开始学习
元数据与SEO	metadata、Open Graph、结构化数据	开始学习
导航与链接	Link组件、useRouter、路由预加载	开始学习
错误处理	error.tsx、not-found.tsx、loading.tsx	开始学习

章节	内容	链接
数据获取基础	fetch API、缓存控制、请求去重	开始学习
Server Components数据获取	异步组件、并行获取、流式渲染	开始学习
Client Components数据获取	SWR、React Query、表单处理	开始学习
缓存策略	请求缓存、全路由缓存、路由缓存	开始学习
数据变更与重新验证	Server Actions、revalidatePath、revalidateTag	开始学习

章节	内容	链接
渲染概述	SSR、SSG、ISR、CSR、RSC	开始学习
服务端渲染SSR	动态渲染、流式渲染、服务端组件	开始学习
静态生成SSG	静态页面、generateStaticParams、静态导出	开始学习
增量静态再生ISR	基于时间验证、按需验证、缓存标签	开始学习
客户端渲染CSR	客户端组件、动态导入、交互功能	开始学习

章节	内容	链接
CSS模块	局部作用域、组合、变量	开始学习
Tailwind CSS	原子化CSS、响应式设计、暗色模式	开始学习
CSS-in-JS	styled-components、emotion、stitches	开始学习
Sass与全局样式	变量、混合、全局样式管理	开始学习

章节	内容	链接
部署到Vercel	Git集成、环境变量、域名配置	开始学习
Docker部署	Dockerfile、多阶段构建、Docker Compose	开始学习
环境变量	.env文件、公开变量、服务端变量	开始学习
性能监控	Web Vitals、日志、错误追踪	开始学习

准备好了吗？让我们从 Next.js简介开始你的学习之旅！

bash

npx create-next-app@latest my-app
cd my-app
npm run dev

祝你学习愉快！