本站是怎么搭起来的
一篇示例文章，同时也是这套自建博客系统的技术说明。可以直接删掉。
这一页 · 4 个章节
这是一篇示例文章，用来验证 Markdown 渲染管线。确认没问题之后可以直接删除
content/posts/colophon.md。
技术栈#
整站不依赖任何博客框架，是从 create-next-app 开始一行行搭起来的：
| 层 | 选型 |
|---|---|
| 框架 | Next.js 16（App Router） |
| 样式 | Tailwind CSS v4 |
| 组件 | shadcn/ui |
| 动效 | Motion + Lenis |
| 图标 | Lucide + Simple Icons |
| Markdown | unified / remark / rehype |
写文章#
在 content/posts/ 下新建一个 .md 文件即可，front matter 支持这些字段：
---
title: "标题"
description: "摘要，会显示在列表页"
date: 2026-08-28
tags: ["标签一", "标签二"]
draft: false # true 则只在开发模式可见
---代码高亮走 Shiki，在构建期完成，浏览器端不加载高亮器：
def fetch(url: str) -> str:
"""抓取 Google Scholar 主页并解析论文列表。"""
with urlopen(Request(url, headers={"User-Agent": UA})) as r:
return r.read().decode("utf-8", "ignore")export function getAllPosts(): PostMeta[] {
return readFiles()
.map(parseMeta)
.filter(visible)
.sort((a, b) => +new Date(b.date) - +new Date(a.date));
}排版元素#
引用块用于强调关键判断。左侧的细线取自整站的强调色。
无序列表：
- 支持 GFM，表格、删除线、任务列表都能用
- 标题会自动生成锚点，右侧目录跟随滚动高亮
- 图片自动加圆角与描边
有序列表：
- 第一步
- 第二步
- 第三步
行内代码写成 pnpm dev，会有独立底色。
关于论文列表#
/about 页的论文列表不是手写的，由 scripts/fetch_scholar.py 从 Google Scholar
抓取后写入 data/scholar.json，页面在构建时读取。抓取失败会保留上一次的数据，
不会把页面弄空。
— 就写到这里 —全部写作