App Router 把路由从配置文件交还给目录结构。在 app 目录里，文件夹对应 URL 片段，page.tsx 对应可访问的页面，layout.tsx 则包裹同一段路径下的所有页面。
这意味着你新增一条路由时，通常不需要去改路由表，只要新建目录和页面文件。博客列表在 /blog，文章详情就可以落在 /blog/[slug]。
页面、布局与特殊文件
page.tsx 是路由的入口组件。同级的 layout.tsx 会在导航时保持状态，适合放导航栏、页脚或共享样式容器。loading.tsx 和 error.tsx 则分别处理加载态与错误边界。
动态段用方括号命名，例如 [slug]。页面可以通过 params 读到当前路径里的 slug，再去 Mock 数据或数据库里查找对应文章。找不到时调用 notFound()，就会走到 404。
和 Pages Router 的差别
Pages Router 以 pages 目录和 _app.tsx 为中心；App Router 默认使用 React Server Components，数据获取可以直接写在服务端组件里，不必再套一层 getServerSideProps。
上手时建议先把静态页和一层动态路由跑通：列表页链到详情页，详情页按 slug 渲染。这正是本项目博客模块采用的结构。