editorial-blog-template
Next.js · React / 博客 · 作者 F0und-icu
基于 Next.js 16、React 19、TypeScript 与 Markdown 的编辑风格博客模板，内置虚构财经刊物 Margin & Measure 的四篇英文文章与两则短札记，提供搜索、目录与静态导出。
模板详细介绍
Editorial Blog Template 是一个面向长篇阅读的 Next.js 博客模板，技术栈为 Next.js 16、React 19、TypeScript 和 Markdown。仓库自带一个虚构的英文财经刊物「Margin & Measure」，用四篇完整文章和两则短札记演示主题效果。页面覆盖首页、文章归档、文章详情、短札记、关于、搜索与 404，并支持客户端全文搜索、可分享的查询与筛选 URL、基于元数据的分类与标签、相关阅读和精选文章排序。
视觉上借鉴印刷期刊：暖色纸张、克制的分隔线、衬线标题与紧凑正文节奏，配色使用纸色 #f6f3ed、墨色 #2c2b27、胡桃色 #825b42 与鼠尾草色 #53684f。桌面端将阅读栏与目录导航分列，移动端收为单栏并折叠导航。模板不下载专有字体，仅引用系统字体，因此不同操作系统下排版略有差异。
内容以 Markdown 文件加 article-meta.json 元数据驱动，分类与标签自由填写，日期为显式编辑字段而非文件时间戳，不支持 YAML front matter。构建产出静态文件到 out/，附带 CI 检查与默认关闭的 GitHub Pages 工作流。示例文章由 AI 辅助撰写，属于教学示例，不构成投资建议。
主要特点
- 内置首页、文章归档、文章详情、短札记、关于、搜索与 404 页面
- 客户端全文搜索，查询与筛选条件可写入 URL 分享
- 元数据驱动的分类、标签、相关阅读与精选文章排序
- 支持 Markdown 表格、引用、列表、语法高亮与可复制代码
- 桌面端粘性目录与移动端可折叠目录
- 静态导出，附带 CI 检查与默认关闭的 GitHub Pages 工作流
适用场景
- 搭建以长篇阅读为主的个人写作站点或专栏
- 发布英文财经、评论类文章并需要分类与标签归档
- 用 Markdown 管理内容、以元数据控制排序与精选
- 部署到 GitHub Pages 或其他静态托管服务
- 在本地预览并定制印刷期刊风格的排版与配色
适合人群
- 习惯用 Markdown 写作并自行管理内容的作者
- 需要静态导出、不依赖数据库或 CMS 账号的博客项目
- 偏好编辑式排版、希望调整配色与字体令牌的开发者
- 想以完整示例文章为起点改写为个人站点的使用者
使用前需要核对
- 使用 Node.js 22，执行 nvm use、npm ci、npm run dev，然后打开 http://localhost:3000
- 无需数据库、CMS 账号、API 密钥或外部字体服务
- 文章写入 content/articles/*.md，并在 content/article-meta.json 添加对应条目；不支持 YAML front matter
- 新增图片后运行 node scripts/article-image-metadata.mjs 刷新尺寸映射
- GitHub Pages 发布默认关闭，需将 Actions 变量 PAGES_ENABLED 设为 true，并按仓库路径设置 NEXT_PUBLIC_BASE_PATH
本介绍由 AI 根据目录元数据和仓库 README 整理，实际功能以原仓库为准。
功能与适用范围
目录记录的用途为博客，主要技术栈为Next.js、React。功能是否完整实现，需要在源码和演示中进一步确认。
- Next.js
- 博客