第一篇文章

Sat, 15 Aug 2026 00:00:00 GMT

https://zhuanlan.zhihu.com/p/2070846252233896417?share_code=9PkbUGIWd6ur&utm_psn=2071734860536885526

无需购买服务器，完全免费部署，新手也能轻松拥有的专属博客

📌 为什么选择这种方式搭建博客？很多朋友想拥有自己的博客网站，但被服务器费用、环境配置、代码部署等门槛劝退。今天分享的这套方案：

✅ 完全免费：GitHub + Cloudflare Workers Pages 永久免费额度 ✅ 极速访问：Cloudflare 全球CDN加速 ✅ 轻松更新：Git推送自动部署，写文章就像写文档 ✅ 支持自定义域名：可绑定自己购买的域名

🛠️ 第一步：挑选心仪的博客模板 1.1 在GitHub搜索项目打开GitHub，在搜索框输入关键词，例如：

astro blog template personal blog starter portfolio blog theme 1.2 按语言筛选（推荐 Astro）在左侧筛选栏选择Language: Astro，Astro 框架生成的博客加载速度快、SEO友好，非常适合博客网站。

1.3 选择标准挑选项目时关注这几点：

⭐ Star数量：越多说明越受欢迎 📅 近期更新：确保项目维护活跃 📖 Readme完整度：有详细部署说明的优先 💡 推荐项目参考：Astro官方主题库或搜索 astro-paper、astro-blog-template 等关键词

📥 第二步：获取源代码 2.1 复制仓库链接进入选中的GitHub仓库，点击绿色的Code按钮，复制 HTTPS 或 SSH 链接。

2.2 克隆到本地 git clone 你复制的仓库链接 2.3 使用IDE打开用 VS Code 或其他代码编辑器打开项目文件夹。

✏️ 第三步：个性化修改 3.1 查看README文档打开项目根目录的 README.md 文件，了解：

项目结构说明依赖安装命令本地启动方式构建命令 3.2 本地预览（推荐）先安装依赖并启动本地预览，方便实时查看修改效果：

npm install 然后在浏览器打开 http://localhost:4321 即可预览。

3.3 修改内容根据自己的需求修改：

网站名称/标题个人头像/封面图关于页面文章内容 🔗 第四步：推送到自己的GitHub仓库 4.1 移除原Git记录删除项目中的 .git 文件夹（Windows下需开启显示隐藏项目）：

rm -rf .git 4.2 初始化新仓库 git init 4.3 创建并推送到远程仓库在GitHub上新建一个仓库（不要勾选README），然后执行：

git remote add origin https://github.com/你的用户名/仓库名.git ☁️ 第五步：部署到Cloudflare Pages 5.1 注册/登录Cloudflare 访问Cloudflare，建议使用GitHub账号直接登录，后续授权更方便。

5.2 设置中文（可选）登录后，在右上角点击个人头像 →语言→ 选择简体中文。

5.3 进入Pages页面左侧菜单 →Workers 和 Pages→ 点击Pages选项卡。

5.4 创建新项目右上角点击创建→ 选择Pages→连接到 Git。

5.5 授权并选择仓库首次使用需授权GitHub账号选择刚刚推送的博客仓库 5.6 配置构建参数从项目的 README.md 中查找构建命令，常见配置：

参数示例值构建命令 pnpm run build 输出目录 dist Node版本 18 或 20 ⚠️ 注意：具体命令请以你的项目 README 为准，不同模板可能不同

5.7 部署点击保存并部署，等待约1-2分钟，Cloudflare 会自动完成构建和部署。

🎉 第六步：访问你的博客部署完成后，Cloudflare 会为你生成一个 .pages.dev 的免费域名，直接点击即可访问。

绑定自定义域名（可选）在 Pages 项目设置中，选择自定义域输入你的域名，按提示添加CNAME记录 📝 后续更新文章以后写新文章只需要：

在本地 posts/ 或 content/blog/ 目录新增 .md 或 .mdx 文件推送代码到 GitHub Cloudflare Pages 会自动检测变更并重新部署 git add . 🔗 资源汇总 GitHub Cloudflare Pages Astro 官方文档 Astro 主题库

我的博客