博客是怎么搭起来的

先还愿：断更一个多月了

9 月 14 号我在第一篇博客里立 flag：要坚持在这里赛博创造。结果只坚持了 7 天，9 月 20 号之后，忙，一直忙到现在。

今天回来更新，顺手看了眼部署记录，发现一个好事：后台一行代码都不用动，markdown 文件扔进去、push，网站自己就更新了。这种「扔进去就自己跑」的爽感，值得写一篇吹吹水——这个博客到底是怎么搭起来的。

一、选型：为什么是 Astro

我的需求就三条：

1. 文章用 markdown 写，9 月刚学完 markdown（见前两篇笔记），学了就得用上
2. 不要自己的服务器，白嫖优先
3. 长得好看，自己从 0 写页面？不可能的，这辈子都不可能

Astro 官方就有一个现成的博客模板，npm create astro 一路回车，本地就能跑起来。写文章就是往 src/content/blog/ 里扔 markdown 文件，头部 frontmatter 写标题、描述、日期，列表页、文章页自动生成，RSS 和站点地图都白送。构建完是一堆纯静态 HTML，随便扔到哪个静态托管上都能跑。

二、搭站三步走

第一步：把模板跑起来

1
npm create astro@latest
2
# 选官方博客模板，一路回车
3
npm run dev

有个小门槛写在模板的 package.json 里：Node 要 22.12 以上，装个新一点的 LTS 就行。

第二步：把「模板」改成自己的站名

模板是别人的，第一件事就是清库：把自带的示例文章全删了。剩下的就是陆陆续续的装修，翻翻提交记录，这一个月的装修账单都在（这就是小步提交的好处，每一步都留了痕迹）：

最惊喜的是改主色调，全局只动了两行 CSS：

1
:root {
2
  --accent: #ff23e2;      /* 原来的 #2337ff 蓝色下岗 */
3
  --accent-dark: #6c008a;
4
}

CSS 变量是真香：改一处，全站的链接、标题、按钮一起换色。导航中文化同理，模板里首页/博客/关于本来就是三个现成链接，换成中文、把社交链接换成自己的，完事。

第三步：搬上线

白嫖三件套：

1. GitHub 建仓库，代码 push 上去
2. Cloudflare Pages 连上这个仓库，构建命令 npm run build，输出目录 dist
3. 构建完直接送一个 xxx.pages.dev 域名，HTTPS 自带

之后就是全自动：每次 git push，Cloudflare 检测到新提交，自己拉代码、自己构建、自己上线。我唯一的工作就是写文章和 push。

三、一个多月用下来的心得

• 先清库再写。 模板的示例文章记得删，不然读者点进去看的是官方的 Hello World，就很尴尬
• push 之前先 build。 本地 npm run build 能提前暴露大部分问题（frontmatter 少字段、日期格式不对），别让线上构建替你发现错误
• frontmatter 日期格式统一。 我前几篇文章一会儿 2026-09-16 一会儿 2026.9.18，都能跑，但这次回头全部统一成 ISO 格式了——能跑和写对是两回事¹
• 小步提交是真的救命。 之前有次把网站改出问题（提交记录里那条「fix: 把网站改正确」就是现场），幸好提交够碎，翻 log 就知道动过哪里

四、接下来

想了想，「每天一篇」这种日更不适合现在的我，忙起来就是断更一个月。以后改成攒素材写长文：坑和学到的东西先记着，写透一篇算一篇。

选题已经躺在小本本里了，下一篇大概会写这个月项目里的调试教训，比如「低 8 位闭合是恒等式，不能拿来当证据」这种，怎么把自己绕进去、又怎么爬出来的。