AI可直接将自然语言描述生成可运行博客代码，2小时内完成从零到上线；需用Cursor开启计划模式、选静态站点技术栈，三句话定义极简博客结构，本地验证后替换内容，再通过Git一键部署至GitHub Pages。

用自然语言描述想法，AI直接生成可运行的博客 代码，跳过写HTML、配CSS、搭环境等繁琐步骤，2小时内完成从零到上线的全过程。

选对工具并完成基础配置

打开 Codex 或 Cursor（推荐 Cursor，国内访问稳定且支持中文模型切换），注册账号后进入主界面→点击左下角【计划模式】开关，确保开启；这一步必须做，否则 AI 会跳过确认直接生成代码，容易产出不兼容或无法本地运行的版本。

在设置中将默认语言设为中文，技术栈偏好选「静态站点 + HTML/Tailwind CSS」，【不要选 React/Vue 等需要构建流程的框架】，避免后续部署时因缺少 npm 环境而卡死。

用三句话定出博客骨架

向 AI 输入：「我要一个极简风格的个人博客，首页显示头像+一句签名+3篇最新文章卡片，每张卡片含标题、发布日期和50字摘要；所有页面用纯静态文件实现，不依赖数据库或后端。」

等待 AI 返回结构说明，确认它理解「无需 CMS、无用户登录、不需评论系统」——这是 Vibe Coding 博客区别于 WordPress 的关键前提，漏掉这点会导致生成带 Firebase 或 Strapi 的代码，徒增部署复杂度。

若 AI 主动提议“可以加 RSS 订阅功能”，直接拒绝；RSS 需额外生成 XML 文件并配置路由，新手第一版务必守住「静态三件套」边界：HTML + CSS + 图片资源。

本地启动并验证效果

第一步：点击 AI 提供的「下载项目」按钮，得到 zip 包→解压到桌面→重命名为 blog-v1；

第二步：用 Cursor 打开该文件夹→唤出 AI 助手，输入：“请识别当前项目类型，并给出一条命令启动本地预览服务器”；

第三步：执行它返回的命令（通常是 npx serve -s 或 python3 -m http.server 8000）→打开浏览器访问 http://localhost:8000；

看到首页正常渲染即成功；若报错「Cannot find module」，大概率是 AI 误写了 require() 语句，此时复制完整报错信息发给 AI，指令限定为：“只告诉我删掉哪一行，不解释原因”。

替换内容与图片

方法一：直接修改 index.html 中的

Your Name

方法二：替换头像图——把原图（如 avatar.jpg）拖进项目根目录，覆盖同名文件；注意文件名必须完全一致，大小建议控制在 200KB 以内，否则首页加载变慢；

方法三：新增文章——打开 articles/ 文件夹（若不存在则新建），放入三篇 Markdown 文件，命名格式为 2026-06-05-my-first-post.md；然后告诉 AI：“按日期倒序读取 articles/ 下所有 .md 文件，提取 frontmatter 中的 title/date/description，生成对应 HTML 卡片”，它会自动补全渲染逻辑。

一键部署到 GitHub Pages

在 Cursor 中唤出终端，依次执行：

git init → git add . → git commit -m "first deploy" → git branch -M main → git remote add origin https://github.com/你的用户名/blog.git → git push -u origin main；

打开 GitHub，进入该仓库 Settings → Pages → Source 选 Branch: main → Save；

等待约 90 秒，页面右上角出现访问链接，点击即可查看线上博客；【首次推送后必须手动点一次 Save，否则 Pages 不会触发构建】。