只用 Codex 客户端,把这个博客部署上线
这篇文章不是传统教程,更像一次现场记录。
一开始,我只是把一段 Dante Astro Theme 的安装流程丢给 Codex,然后说:
根据以上的流程帮我,就是怎么说呢,帮我部署一下这个我的静态博客的网站吧。
我的目标很直接:不要只告诉我怎么做,直接帮我把网站跑起来、部署出去。
从空目录开始
当时本地目录 /Users/chenjiahao/Documents/myblog 里几乎是空的,只有一个还没有提交记录的 Git 仓库。Codex 先检查了 Node 和 npm,再把 Dante Astro Theme 拉下来,保留原来的 .git,把主题文件复制进当前目录。
这一点挺舒服:我不用自己在不同目录之间来回移动,也不用担心把 Git 仓库弄乱。它先看环境,再动手。
关键步骤大概是这样:
npm install
npm run build
第一次构建成功后,dist/ 目录就生成了可以部署的静态文件。到这里,本地部分已经成型。
Cloudflare 授权:唯一需要我点一下的地方
接下来是 Cloudflare Pages。
Codex 先检查 Wrangler 是否已经登录。结果当然没有,于是它发起:
npx wrangler login
这一步浏览器会打开 Cloudflare 的 OAuth 页面。我第一次没看见弹窗,于是我说:
你可不可以重新授权一下?我刚刚可能没看见。
它就把旧的登录进程清掉,重新发起授权。等我在浏览器里点完允许,终端里出现了:
Successfully logged in.
后面部署时又遇到一个小插曲:my-blog 这个 Cloudflare Pages 项目还不存在。Codex 不是停下来让我自己去控制台点来点去,而是直接创建项目:
npx wrangler pages project create my-blog --production-branch=master
然后再部署:
npx wrangler pages deploy ./dist --project-name my-blog --commit-dirty=true --branch master
最后 Cloudflare 给了线上地址:
从主题演示站,改成我的个人博客
部署成功后,站点还只是一个英文模板。于是我告诉 Codex:
我本人的名字叫做嘉豪,然后我是一个有十年写代码经验的程序员,然后我最近在 vibe coding 做一些自己的东西。
我还给了两个项目链接:
Codex 做了几件事:
- 把站点标题改成“嘉豪”。
- 把首页介绍改成我的个人简介。
- 把 About、Contact、Projects 都换成真实内容。
- 删除主题自带的虚构项目和英文示例文章。
- 新增第一篇中文博客。
- 把整个站点界面中文化。
这是现在的首页:

中文化不是只改几段正文
我后来又补了一句:
这个网站一定要是对中文支持友好的,因为我看现在全都是英文界面。
这一步很重要。
很多模板表面上“能写中文”,但导航、按钮、分页、标签、日期格式、SEO 标题还是英文。Codex 把这些界面骨架都改了:
Home改成首页Projects改成项目Blog改成博客Tags改成标签Read Post改成阅读文章View Project改成查看项目- 日期格式改成中文
- HTML 语言改成
zh-CN
现在项目页看起来就是中文站点,而不是英文模板里塞了几段中文:

标签页也变成了中文语境:

本地预览:不用每次都发线上
部署之后我意识到一个问题:如果每改一次都要发布到 Cloudflare 才能看效果,那就太慢了。
于是我问:
这些怎么本地预览呢?我不想每一次都还要手动发布到线上才能够看到效果。
答案是启动 Astro 开发服务器:
npm run dev
通常它会跑在:
http://localhost:4321/
如果端口被占用,Astro 会自动换到另一个端口,比如这次截图时就跑到了 4322。本地预览最大的好处是:改内容后页面会自动刷新,确认满意了再部署。
我又直接说:
你直接帮我启动吧,我想直接能够在这里预览。
于是 Codex 直接启动了本地服务器。到这里,我就可以在 Codex 的内置浏览器里边看边改。
这是第一篇文章的本地预览:

一次小改名:web coding 到 vibe coding
后面我又做了一个非常小但很真实的修改:
web coding -> vibe coding
这类修改如果自己手动找,可能会漏掉页面描述、标签、项目简介、博客标题、URL slug。Codex 做的是全站搜索,然后统一替换,还把文章路径从:
/blog/hello-web-coding/
改成:
/blog/hello-vibe-coding/
这就是我喜欢这种工作流的地方:小改动也可以做完整,不只是“替换眼前那一行”。
这次流程给我的感觉
这次建站像是一次很短的 pair programming。
我负责描述方向:
- 我要部署静态博客。
- 我叫嘉豪。
- 我有十年写代码经验。
- 我在做 vibe coding。
- 我要放 VibeHunt 和 KnowUV。
- 我要中文友好。
- 我要本地预览。
Codex 负责把这些意图落到文件、命令、构建和部署上。
它不是只给我一份说明文档,而是实际完成了这些动作:拉代码、装依赖、构建、登录 Cloudflare、创建 Pages 项目、部署、改内容、删模板文章、中文化 UI、启动本地预览、截图验证。
当然,这里面也有需要人参与的地方,比如 Cloudflare 授权必须由我在浏览器里点允许。还有一些内容表达,最后还是应该由我自己审一遍。但整个过程已经不再是“我照着教程一步步复制命令”,而更像“我说我要什么,它把工程路径铺出来,然后我们一起校准”。
最后
现在这个博客已经上线,也可以在本地预览。
线上地址:
本地开发:
npm run dev
部署:
npm run build
npx wrangler pages deploy ./dist --project-name my-blog --commit-dirty=true --branch master
这篇文章本身也算是这个博客的第二个内容实验:用一次真实对话,记录一个网站如何从空目录变成可以访问的个人站点。