小满zs

缓存策略(Cache Strategies) 缓存策略分两种： 未启用缓存组件: 确保cacheComponents配置为false或者不配置。 src/app/home/...

缓存组件(Cache Components) 什么是Cache Components? Cache Components 是Next.js(16)版本特有的机制，实现了静态...

RSC(React Server Components) RSC(服务器组件)是React19正式引入的一种新的组件类型，它可以在服务器端渲染，也可以在客户端渲染。 像传统...

渲染基础 本章我们学习 CSR SSR SSG 三种渲染方式,以及Hydration水合的概念。 CSR CSR是Client Side Rendering的缩写，即客户端...

Proxy代理 如果你想升级为16.x版本，Next.js提供了命令行工具来帮助你升级，只需要执行以下命令即可： 代码转换会将文件和函数名从middleware重命名为pr...

AI Vercel提供了AI SDK，可以让我们在Next.js中轻松集成AI功能。AI SDK 官网 安装AI-SDK 这儿我们使用deepseek作为AI模型，@ai-...

路由处理程序(Route Handlers) 路由处理程序，可以让我们在Next.js中编写API接口，并且支持与客户端组件的交互，真正做到了什么叫前后端分离人不分离。 文...

路由组 路由组也是一种基于文件夹的约定范式，可以让我们开发者，按类别或者团队组织路由模块，并且不影响 URL 路径。 用法：只需要通过(groupName)包裹住文件夹名即...

平行路由 平行路由指的是在同一布局layout.tsx中，可以同时渲染多个页面，例如team，analytics等，这个东西跟vue的router-view类似。 基本用法...

动态路由 动态路由是指在路由中使用方括号[]来定义路由参数，例如/blog/[id]，其中[id]就是动态路由参数，因为在某些需求下，我们需要根据不同的id来显示不同的页面...

路由导航 路由导航是指我们在Next.js中跳转页面的方式，例如原始的<a>标签，等。 在Next.js中，共有四种方式提供跳转: Link组件 useRouter Hoo...

Next.js 路由概览 Next.js 使用基于文件系统的路由，这意味着文件和文件夹的结构直接决定了应用的路由结构。 基于文件系统的路由 我们只需要创建对应的文件和文件夹...

Next.js 项目搭建 创建项目 快速入门 注： 当前教程为16.0.1版本，最低Node.js版本为20.9.0 接下来会有几个问题需要你选择，根据你的需求选择即可 W...

开始使用 Next.js 欢迎来到 Next.js 学习之旅！本教程将带你从零开始创建你的第一个 Next.js 应用。 我们所学的版本是16.0.1 什么是 Next.j...

useImmer 概述 useImmer 是基于 immer 库实现的一个 React Hook，它让你可以像修改可变数据一样来修改不可变数据。immer 是一个不可变的数...

HOC(Higher Order Component) 高阶组件 什么是高阶组件？ 高阶组件就是一个组件，它接受另一个组件作为参数，并返回一个新的组件，（如果你学过Vue的...

订阅 zustand 的 subscribe，可以订阅一个状态，当状态变化时，会触发回调函数。 订阅一个状态 只要store 的 state 发生变化，就会触发回调函数，另...

中间件 zustand 的中间件是用于在状态管理过程中添加额外逻辑的工具。它们可以用于日志记录、性能监控、数据持久化、异步操作等。 自定义编写中间件 我们实现一个简易的日志...

状态简化 回忆一下我们在使用zustand时，是这样引入状态的(如下),通过解构的方式引入状态，但是这样引入会引发一个问题，例如A组件用到了 hobby.basketbal...

状态处理 在上一章我们讲了，Zustand会合并第一层的state，但是如果深层次应该如何处理呢 来吧演示 首先创建一个葫芦娃，葫芦娃有七个娃，每个娃都有自己的状态，我们可...