Next.js App Router 的内容站点实践

先从路由树开始

内容站点的路由通常不复杂，但它决定了后续代码的形状。首页负责引导，文章列表负责浏览，详情页负责阅读体验，标签页负责低成本聚合。

App Router 的优势在于布局、数据读取和页面边界可以自然地贴合这个结构。对于博客来说，大多数页面都可以保持为 Server Components。

Server Components 适合内容读取

读取本地 MDX、解析 frontmatter、排序文章和生成 metadata 都是服务端更自然的事情。把这些逻辑放在服务端，可以减少客户端 JavaScript，也能让页面输出更稳定。

客户端组件只留给必要交互

主题切换、移动端抽屉、下拉菜单这类交互才需要 use client。如果一个组件只展示内容，优先让它留在服务端。

保持内容系统可替换

首版使用 src/content/posts 存放 MDX 文件已经足够。它简单、可版本管理，也便于未来迁移到 CMS 或数据库。

关键是不要过早抽象。先把文章读取、标签聚合、目录生成这些基础能力写清楚，再根据真实需求演进。

小结

App Router 很适合个人内容站点，但前提是保持边界清晰：路由负责页面结构，lib 负责数据读取，组件负责展示，内容文件只关心写作。