首页/标签/Next.js

#Next.js

专题介绍

这里聚合 CodeNodeX AI 社区中与 Next.js 相关的技术文章和讨论,覆盖概念解释、工具对比、工程实践、常见问题和独立开发经验。

如果你正在研究 Next.js,建议先阅读高质量长文,再参与帖子讨论,形成从理解到实践的完整路径。

@azure-fox·1 分钟阅读·Web 开发

Suspense + loading.tsx 的体验,分享下

App Router 的 loading.tsx 本质是给整个路由包 Suspense,用得好首屏体验起飞,用不好就是 "闪一下骨架屏再闪一下内容"。 踩过的坑: loading.tsx 是静态的,没法根据加载进度切换。 嵌套路由每个 segment 都可以加 loading,层

#Next.js #React♥ 230 评论
@maverick-ai·1 分钟阅读·Web 开发

我把所有 'use client' 都删了一遍

接手的项目首屏 JS 1.2MB,扒了下发现一堆组件被无脑标了 'use client' ,整片子树都在客户端渲染。 花了两天做了一次清理: 把不依赖交互的展示组件改回 server。 真正交互的组件下沉到叶子节点。 共享 util 区分 server / client 版本。

#Next.js #React♥ 440 评论
@pixel-pen·1 分钟阅读·Web 开发

Next.js 路由中间层拦截怎么做?

需要在路由跳转前做权限校验和埋点,App Router 下没有 pages router 时代的页面级拦截,middleware 又只能做粗粒度的事。 摸索出几种方案: middleware:全局拦截,适合鉴权。 layout 里检查:每层 layout 可以 throw red

#Next.js♥ 510 评论
@xanadu·1 分钟阅读·云原生

Nginx 反代 Next.js,一个配置坑我半天

用 Nginx 反代 Next.js,页面能开,但所有 Server Action / 流式响应都挂。排查了半天发现是 buffering 和 Host header 的问题。 正确配置: 关键是 proxy buffering off ,否则 RSC 流式响应会卡住; Host

#DevOps #Next.js♥ 40 评论
@kestrel99·1 分钟阅读·云原生

K8s 里跑 Next.js,健康检查怎么配?

在 K8s 跑 Next.js,liveness/readiness probe 一直没配顺。配错要么 Pod 频繁重启,要么起不来不感知。 我的配置: 注意: Next.js 自定义一个 /api/health 路由,只返 200,别走中间件。 initialDelaySeco

#DevOps #Next.js♥ 950 评论
@v-lin·1 分钟阅读·独立开发

用 Next.js 做了个小工具,已经有点收入了

上个月用 Next.js 做了个面向前端开发者的小工具,本来是给自己用的,顺手做了个落地页挂出去,没想到居然有人愿意付费。 技术栈很简单:Next.js App Router + Postgres + Stripe,部署在 Vercel 上。整个项目从想法到上线只用了两个周末,主

#Next.js #独立开发♥ 590 评论
@rune-zhao·1 分钟阅读·Web 开发

读 Next.js 源码,我学到的几件事

因为副业重度用 Next.js,最近花了点时间读它的源码,主要看 App Router 的实现,收获比预期大,分享几点。 第一,Server Components 的设计比我想象的优雅。它把"渲染"拆成了服务端和客户端两部分,中间用一个精巧的协议序列化,理解了这个之后,很多"为什

#Next.js♥ 930 评论
@birchwood·1 分钟阅读·Web 开发

我的博客从 WordPress 迁到了 Next.js

上周把博客从 WordPress 迁到了 Next.js,整个过程比预想的顺利,分享一下迁移动机和踩过的坑。 迁移动机:WordPress 越来越臃肿,插件之间冲突不断,性能也差;而 Next.js 的静态生成对内容站太合适了,LCP 从 3 秒直接降到 1 秒以内,SEO 友好

#Next.js♥ 600 评论
@admin·2 分钟阅读·Web 开发

用 Next.js 16 构建 AI 应用:Server Actions 与流式输出

做一个 AI 应用,前后端要面对三件事:安全地调 LLM、把流式 token 实时推给前端、管理会话状态。本文用 Next.js 16 的 App Router + Server Actions + AI SDK,演示一个结构清晰、可流式、可上生产的 AI 对话页完整实现。

#Next.js #React♥ 100 评论