我一直想有一个真正属于自己的地方，用来放长期值得保留的技术笔记、项目复盘和踩坑记录。

社交平台适合分享，但不适合沉淀；云笔记适合整理，但不适合公开表达。相比之下，一个独立博客更像是两者之间的折中：它既能被别人访问，也能完全按自己的方式组织内容。

这篇文章记录一下，我是如何从一个已经买好的域名出发，把这个博客从 0 搭建到正式上线的。

我想要的，不只是“能发文章”

在真正开始之前，我先明确了几个要求：

  1. 页面要能自己控制
    我不想被现成主题完全限制，希望首页、文章页、标签页这些结构都能按自己的想法调整。

  2. 不想自己租服务器
    我不希望为了一个博客额外维护 VPS、数据库、安全更新和备份。

  3. 电脑不需要一直开机
    网站上线后，应该由托管平台负责持续运行。

  4. 后续写作要方便
    我希望文章最终能用 Markdown 管理，而不是每写一篇都手动维护 HTML。

这些要求把选择范围收得很窄。
最后我选了这套方案：

Astro + GitHub + Cloudflare Pages

为什么是 Astro

Astro 对我来说最合适的地方有三个：

  • 它天然适合内容型网站；
  • 页面结构可以完全自己控制；
  • Markdown 内容集合很适合长期维护博客文章。

如果只是想最快发文，WordPress 或 Ghost 也能做到。
但我更在意页面控制权，所以愿意接受一点前期搭建成本，换取后续更高的自由度。

最终的整体架构

整个站点最后可以概括成下面这样：

Markdown 文章
   ↓
Astro 构建
   ↓
GitHub 托管代码
   ↓
Cloudflare Pages 自动部署
   ↓
自定义域名访问

在项目里，核心目录大概是：

src/
  content/
    blog/        # Markdown 文章
  pages/         # 页面路由
  components/    # 通用组件
  layouts/       # 页面布局

这套结构的好处是：
写文章和维护页面被分开了。
以后新增文章时，我只需要往 src/content/blog/ 里增加 Markdown 文件，首页、文章列表、RSS 和标签页都会自动更新。

从 0 到上线，我做了哪些事

1. 先做静态原型，而不是一开始就堆功能

一开始我没有马上进入框架，而是先把首页、文章页、关于页这些核心页面做成静态原型。
这一步帮助我先确定：

  • 网站整体气质
  • 页面层级
  • 技术博客该有怎样的信息密度

等风格定下来后，再把静态页面迁移到 Astro，反而比一开始就在框架里反复改更省心。

2. 把原型迁移成 Astro 工程

迁移时，我做了几件关键的事：

  • 把公共头部和页脚拆成组件；
  • 把页面布局抽成 BaseLayout；
  • 用内容集合管理 Markdown；
  • 用动态路由生成文章详情页；
  • 让首页和文章归档页自动读取文章数据。

这样做之后，博客不再是一堆手写页面，而是一套可以持续扩展的内容系统。

3. 补齐上线前必须有的基础设施

一个“能打开的网站”和一个“适合长期发布的网站”之间，差的往往是这些细节：

  • rss.xml
  • sitemap.xml
  • robots.txt
  • canonical URL
  • 深色模式
  • 标签页
  • 搜索页
  • 文章阅读时间
  • 目录
  • 代码块复制按钮

这些功能单独看都不大，但组合起来，才更像一个真正能长期使用的技术博客。

4. 推送到 GitHub

项目稳定之后，我把代码推到了 GitHub。
这样做有两个直接好处：

  • 代码和内容都能做版本管理；
  • Cloudflare Pages 可以直接监听仓库更新，做到每次 push 自动部署。

5. 用 Cloudflare Pages 部署

Cloudflare Pages 的配置很简单：

Framework preset: Astro
Build command: npm run build
Build output directory: dist

部署完成后，平台会给一个临时域名，例如：

dcq-blog.pages.dev

之后再把自己的域名通过 CNAME 指向这个地址，就能用正式域名访问了。

过程中遇到的几个小坑

npm 环境没有立即生效

我已经装好了 Node.js，但当前终端一开始找不到 npm。
最后发现只是环境变量还没在当前会话刷新，实际可用的 npm 在另一个安装目录里。

这个问题不大，但很典型：
有时候不是没装好，而是当前终端还没“看到”它。

一开始误建成了 Worker，而不是 Pages

Cloudflare 控制台现在的入口不少，第一次操作时我一度创建成了 Worker 项目。
后来重新回到 Pages 流程，按静态站部署方式重新创建，才走到了正确路径上。

自定义域名需要 DNS 生效时间

把 www 的 CNAME 指向 Pages 地址后，并不是马上就能访问。
Cloudflare 需要重新检查 DNS，域名解析本身也要一点传播时间。

这一步最需要的不是多做什么，而是耐心等它真正生效。

现在我得到的是什么

到这里，我已经有了一套比较完整的个人博客系统：

  • 代码托管在 GitHub；
  • 网站自动部署在 Cloudflare Pages；
  • 文章用 Markdown 写；
  • 有标签、搜索、深色模式、RSS、sitemap；
  • 使用自己的域名对外访问。

更重要的是，它不是一次性完成的“作品”，而是一个以后可以继续生长的地方。

如果你也想搭一个，我会怎么建议

如果你和我一样：

  • 想控制页面；
  • 不想维护服务器；
  • 愿意写一点代码；
  • 希望长期把内容留在自己手里；

那我会很推荐：

Astro + GitHub + Cloudflare Pages

它不是唯一答案，但对个人技术博客来说，是一个控制力、成本和维护难度都很平衡的选择。

接下来

这个站点已经搭好了，真正重要的事情才刚开始：

持续往这里放入值得保留的内容。

如果以后我还继续修改这个博客，我也会把那些调整过程继续记录下来。毕竟，一个博客最好的介绍，不是首页上的一句话，而是它日后慢慢长成的样子。