从零搭建个人博客：Astro + Cloudflare Pages

花了一天时间把自己的博客搭起来了，记录一下主要流程，希望对想自建博客的同学有参考价值。

为什么选这套方案

最开始考虑过 WordPress 和 Ghost，但它们需要一直运行在服务器上，吃内存、要维护。

最终选了 Astro + Cloudflare Pages：

• Astro：静态站生成器，把 Markdown 文章编译成纯 HTML，不需要服务器运行时
• Cloudflare Pages：免费托管静态站，全球 CDN 加速，git push 自动发布
• Decap CMS：浏览器里直接写文章的后台，不用每次开命令行

整个链路：写文章 → 保存 → GitHub → CF Pages 自动构建发布。服务器全程不参与。

主要步骤

1. 克隆主题

astro-nano 是一个极简风格的 Astro 主题，开箱即用。

git clone https://github.com/markhorn-dev/astro-nano blog
cd blog
npm install
npm run dev  # 本地预览

2. 基础配置

编辑 src/consts.ts，改成自己的站名、简介和社交链接：

export const HOME: Metadata = {
  TITLE: "你的博客名",
  DESCRIPTION: "一句话介绍",
};

export const SOCIALS: Socials = [
  { NAME: "github", HREF: "https://github.com/你的用户名" },
  { NAME: "telegram", HREF: "https://t.me/你的用户名" },
];

3. 部署到 Cloudflare Pages

1. 把项目推到 GitHub
2. 进 Cloudflare Dashboard → Workers & Pages → Create → Pages → Connect to Git
3. 选仓库，构建配置：
   • Build command：npm run build
   • Output directory：dist
4. 部署完成后绑定自己的域名（Custom domains）

4. 接入 Decap CMS（可选）

这步让你可以在浏览器里直接写文章，不用开命令行。

需要做的事：

1. 在 GitHub 创建一个 OAuth App（Settings → Developer settings → OAuth Apps）
2. 在项目里新建 public/admin/index.html 和 public/admin/config.yml
3. 用 Cloudflare Pages Functions 写一个 OAuth 代理（处理 GitHub 登录）
4. 在 CF Pages 设置环境变量存 Client Secret

配置好后访问 你的域名/admin 就能用浏览器写文章了。

写文章

文章放在 src/content/blog/ 下，每篇一个文件夹：

src/content/blog/
└── my-first-post/
    └── index.md

Markdown 文件头部格式：

---
title: "文章标题"
description: "简介"
date: 2026-05-19
draft: false
---

正文内容...

写完 git push，Cloudflare Pages 一分钟内自动发布。

总结

整套方案完全免费（CF Pages 免费层对个人博客够用），不吃服务器资源，git push 即发布。

如果你也想搭一个，主要卡点通常在 Decap CMS 的 OAuth 配置上，其余步骤都比较顺。