首页
AI Coding
数据标注
NEW
沸点
课程
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
Next.js16 教程
小满zs
创建于2025-11-11
订阅专栏
Next.js 教程全解 免费 开源
等 165 人订阅
共23篇文章
创建于2025-11-11
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
Next.js第二十三章(Next配置文件)
next.config.js配置 本章会讲解Next.js的配置文件next.config.js的配置项。注:本章不会讲所有的配置项,只会讲使用率50%的配置项,以及项目中真实使用的配置项。 查看完整
Next.js第二十二章(国际化)
国际化(i18n) 国际化(Internationalization)是Next.js提供的一种机制,用于支持多语言的网站,例如可以实现中英文切换,包括接口同步翻译,以及不同语言所展示的页面不一样等。
Next.js第二十一章(环境变量)
环境变量 环境变量一般是指程序在运行时,所需要的一些配置信息,例如数据库连接字符串,API密钥,端口号等。其次就是环境变量跟我们的操作系统有关,例如Linux,Windows,Mac等。 基本用法 我
Next.js第二十章(MDX)
MDX MDX是一种将Markdown和React组件混合在一起的语法,它可以在Markdown中使用React组件,从而实现更复杂的页面。另外就是我们在编写技术文档或者博客的时候,配合SSG模式,更
Next.js第十九章(服务器函数)
服务器函数(Server Actions) 服务器函数指的是可以是服务器组件处理表单的提交,无需手动编写API接口,并且还支持数据的验证,以及状态管理等。 核心原理 是因为React扩展了原生HTML
Next.js第十八章(静态导出SSG)
静态导出SSG Next.js 支持静态站点生成(SSG,Static Site Generation),可以在构建时预先生成所有页面的静态 HTML 文件。这种方式特别适合内容相对固定的站点,如官网
Next.js第十七章(Script脚本)
Script组件 Next.js允许我们使用Script组件去加载js脚本(外部/本地脚本),并且他还对Script组件进行优化。 基本使用 局部引入 src/app/home/page.tsx 在h
Next.js第十六章(font字体)
font字体 next/font模块,内置了字体优化功能,其目的是防止CLS布局偏移。font模块主要分为两部分,一部分是内置的Google Fonts字体,另一部分是本地字体。 基本用法 Goggl
Next.js第十五章(Image)
Image组件 该组件是Next.js内置的图片组件,是基于原生img标签进行扩展,并不代表原生img标签不能使用。 尺寸优化:支持使用现代化图片格式,如webp,avif,apng等,并自动根据设备
Next.js第十四章(缓存策略)
缓存策略(Cache Strategies) 缓存策略分两种: 未启用缓存组件: 确保cacheComponents配置为false或者不配置。 src/app/home/page.tsx(新建一个页
Next.js第十三章(缓存组件)
缓存组件(Cache Components) 什么是Cache Components? Cache Components 是Next.js(16)版本特有的机制,实现了静态内容 动态内容 缓存内容的混
Next.js第十二章(RSC/服务端组件/客户端组件)
RSC(React Server Components) RSC(服务器组件)是React19正式引入的一种新的组件类型,它可以在服务器端渲染,也可以在客户端渲染。 像传统的SSR他是在服务器提前把页
Next.js第十一章(渲染基础概念)
渲染基础 本章我们学习 CSR SSR SSG 三种渲染方式,以及Hydration水合的概念。 CSR CSR是Client Side Rendering的缩写,即客户端渲染。像我们使用的Vue R
Next.js第十章(Proxy)
Proxy代理 如果你想升级为16.x版本,Next.js提供了命令行工具来帮助你升级,只需要执行以下命令即可: 代码转换会将文件和函数名从middleware重命名为proxy。 基本使用 应用场景
Next.js第九章(AI)
AI Vercel提供了AI SDK,可以让我们在Next.js中轻松集成AI功能。AI SDK 官网 安装AI-SDK 这儿我们使用deepseek作为AI模型,@ai-sdk/react封装了流式
Next.js第八章(路由处理程序)
路由处理程序(Route Handlers) 路由处理程序,可以让我们在Next.js中编写API接口,并且支持与客户端组件的交互,真正做到了什么叫前后端分离人不分离。 文件结构 定义前端路由页面我们
Next.js第七章(路由组)
路由组 路由组也是一种基于文件夹的约定范式,可以让我们开发者,按类别或者团队组织路由模块,并且不影响 URL 路径。 用法:只需要通过(groupName)包裹住文件夹名即可,例如(shop),(us
Next.js第六章(平行路由)
平行路由 平行路由指的是在同一布局layout.tsx中,可以同时渲染多个页面,例如team,analytics等,这个东西跟vue的router-view类似。 基本用法 平行路由的使用方法就是通过
Next.js第五章(动态路由)
动态路由 动态路由是指在路由中使用方括号[]来定义路由参数,例如/blog/[id],其中[id]就是动态路由参数,因为在某些需求下,我们需要根据不同的id来显示不同的页面内容,例如商品详情页,文章详
Next.js第四章(路由导航)
路由导航 路由导航是指我们在Next.js中跳转页面的方式,例如原始的<a>标签,等。 在Next.js中,共有四种方式提供跳转: Link组件 useRouter Hook (客户端组件) redi
下一页