周末一句「帮我做一个好看的个人站」,Accept All,本地一开——爽。
这事本身没问题。有问题的是:同一套手法,周一绑上域名、开始收真实留言、还想写进简历。
Karpathy 说的vibe coding,原意就是故意不看代码、忘掉 diff。Fowler、Willison 也这么划线:适合扔的、玩的、自己坑自己的。
AI 写、你审、你测、你能跟人讲清这段在干嘛——那不叫 vibe,那是正常用工具写软件(有人叫 agentic engineering,名字不重要)。
一句话分轨:
能扔→ 可以 vibe
要养(长期网址、真表单、以后还要改)→ 得看着代码走
「用了 AI」不等于 vibe。审过、测过、讲得清,就不是。
个人站上,两种玩法差在哪
周末 vibe | 要挂域名的那种 | |
|---|---|---|
你在验证什么 | 版式喜不喜欢 | 换台电脑还能 build、邮件真能到、三个月后还改得动 |
看不看代码 | 基本不看 | 布局可以扫一眼;表单和密钥必须看 |
怎样算完 | 本地好看 | build 过、主路径手点过、知道怎么回滚 |
版式可以 vibe 两三套。选定以后,别再「一整站 vibe 到底」——首页、博客、表单、部署,一块一块来,对外只说「本周上静态简历页」,别吹「一周上带 CMS 的产品站」。
瀑布、敏捷、XP 那些老词,这里不必背。个人站更像:先扔几个草稿试味道,再短步往前拱;质量靠「能 build、能讲清」,不靠站会贴纸。
搭着搭着,坑一般长这样
「先做个站」——模型很热心,评论区、登录、分析脚本一起塞进来,你本来只想放三行简介。
本地npm run dev美滋滋;一 build,图片 404,暗色模式碎一地。联系表单弹「已发送」,Network 里其实是 500,或者邮件进了垃圾箱。API Key、Analytics ID 写进前端包——你看不见,爬虫看得见。
三个月后想改导航,目录像考古现场:当初 Accept All 的,自己也读不懂。
所以真要养站,人得守几件具体的事(不是背七条教条):
你定边界:内容用 Markdown,别一上来上数据库。
一次聊一件:先信息架构,再首页,再表单——别一个会话从头干到尾。
说清楚怎样算完:比如
npm run build过,再手点三条主链。加博客时别「顺便重写设计系统」。
表单、域名、密钥——再懒也自己看一眼 diff。
把常用命令和「不许干什么」写进仓库的
AGENTS.md,别只活在聊天记录里。上线平台确认能一键回滚。
Prompt 是商量;build 挂了合不进主分支,才是规矩。模型写烂了,优先把 lint / build / 禁区写进仓库,别玄学下一条咒语。
怎么排期,别跟自己玩假敏捷
可以这么走:
一晚草稿(可 vibe):两三个版式,只本地看,不绑域名、不接真邮箱。
选定后短步走:首页 → 博客列表 → 联系表单(加点防刷)→ 域名和自动 build。
改旧站:先列出「现在能打开的页面」,再让 AI 改——别拿「新建站三天搞定」要求迁 WordPress。
假敏捷长这样:不写任何约定,下次会话忘了用的 Astro 还是 Next;今天塞 Framer,明天换一套 UI 库;嫌 build 烦,去掉检查,「预览能开」就算上线。
敏捷要的是可工作的软件,不是「演示好看」。演示是 vibe 的强项;养得住,还得靠检查和收束。
跟 AI 说话时,稍微像个人
别说「把认证做好」那种空话。个人站可以说清楚:
首页要有姓名、简介、三个链接;只改首页相关文件;做完跑
npm run build,过了再说。
一次只合并「博客列表」,别顺手开 CMS。布局 diff 可以快扫;.env和表单逻辑,自己读。手机宽能不能读完简介——你自己就是验收人。
老派 XP 那套(小步、先有检查再改、结对)在这里就是:你掌舵,AI 打字,关键路径你别躺平。
真要上线,大致走这么一遭
不必背流程图。按个人站说人话:
想清楚:访客十秒内知道你是谁,能点到 GitHub / 简历 / 联系。
先问再写:「列几种静态站做法和取舍,先别写代码。我要是嚷嚷上 CMS,你先怼我。」
写死几条:用啥框架、有哪几页、禁止乱加依赖和数据库、验证命令是
npm run build。最小检查:build 必须过;首页有姓名;
/blog能列出两篇样例。下手:「只做首页,别动部署配置。」
挂了:日志贴回去,让它改;别无限循环。
你过目:外链、图片路径、有没有密钥;表单必看。
先预览,再解析域名;确认坏了能退回上一版。
收拾:删掉没用的 UI 库;在
AGENTS.md补一句「加依赖先问」。
绑了域名的站,至少满足:
build 过
手机上首页可读,三主链能点
密钥不进 git,表单有基本校验
你能讲清:页从哪来、文章从哪读、表单打到哪
知道怎么回滚
周末自嗨的草稿,标准可以只有一条:自己开心,扔了不心疼。别拿那条标准去考核公开站。
给仓库一点记忆,比给模型长篇大论管用
聊天里的约定,下个会话就没了。根目录丢个短的AGENTS.md就够个人站用:
# Commands - Dev: npm run dev - Build: npm run build - Lint: npm run lint # Structure - Pages: src/pages/ - Content: content/posts/*.md - Components: src/components/ # Never - Do not commit .env* or API keys - Do not add a database without asking - Do not upgrade Next/Astro major unless asked再加一条 CI:PR 上跑npm run build,挂了别合并。有表单再补提交校验。密钥扫描有更好。
别一上来就搞「多 Agent 并行装修」——个人站有AGENTS.md、会自动 build、你知道密钥在哪,就已经比大多数 vibe 站强。改文案用补全就行;新板块你定方向 AI 写;「只做博客列表」这种单任务可以放手一点。
每月花十分钟:清没用的依赖、核对部署说明还准不准、暗色模式 TODO 要么做要么删。AI 代码一样会烂尾。
啥交给 AI,啥你别甩手
布局、组件草稿、仿现有文章页——交给它。
域名 DNS、OAuth、Resend/Stripe 的 Key、最终点 Deploy——你来。
它写的测试断言,你看是不是在测真行为,还是删检查「变绿」。
「好像 SEO 好了」不算数,Search Console 才算。
Fowler 提醒过的几件事,个人站天天见:
安全:表单地址、Analytics、存储凭证最容易进包。
以后改不动:单文件两千行的万能 page,半年后连模型都晕。
表面成功:绿勾 toast,背后请求挂了。
调试别听故事:打开 Network,看平台日志。
专门开一轮找茬也行:「空提交、超长字符、断网,看你怎么破。」
常见翻车,对照着躲
现象 | 多半因为 | 个人站样子 |
|---|---|---|
好看但假 | 没验收 | toast 成功,邮件没有 |
直接公网 | 草稿当成品 | 没 build 就绑域名 |
半套残骸 | 一句「做完整站」 | CMS 建一半扔那儿 |
组件过、整站挂 | 没集成看一眼 | 生产图片全 404 |
永远差一口气 | 被预览骗了 | 无域名 / 无 HTTPS / 无表单 |
依赖风暴 | 没禁区 | 静态站塞了 Docker Compose |
检查没了 | 嫌烦 | 删掉 build「就绿了」 |
自己成外人 | 长期不读 diff | 不知 Markdown 在哪个文件夹 |
公式很简单:
周末不审的习惯 × 周一要给面试官看 × 预览太好看
= 能跑的站,最会丢人(或泄密)
新建落地页快,迁老站慢——别用同一种期待折磨自己。
两条轨道,别混着考核
轨道 A(vibe):选风格、试框架、周末玩。不绑域名,预览链接够了,仓可以随时删。
轨道 B(要养):长期网址、真留言、写进简历。有约定、有 build、审表单和密钥、结构你讲得清。
A 有用,能让你摸清模型边界。
别用 A 的速度承诺 B 的结果;也别给 A 套一堆仪式假装很工程。
先把预览丢给朋友点点,再解析域名。表单选带配额的服务,设一下账单告警——按量计费 API 是 vibe 经典爆点。
你想这周就动手
看一眼:现在有没有自动 build?密钥会不会进 git?目录自己是否看得懂?
写短
AGENTS.md(命令、内容目录、禁数据库、禁瞎升级)。PR 上挂一个
npm run build。跟自己约定:改颜色文案可以飘;动路由、表单、部署就收心。
顺序:首页 → 一篇样例博文 → 联系表单。每步:说清楚 → 做 → build → 你能讲清再合。
改旧站的,先列出当前能开的 URL。
周末问自己:依赖是少了还是多了?不打开旧聊天,能不能改一行简介?
收尾
vibe 是选味道的;养站点靠看着代码 + build 门禁。
预览骗眼睛,域名和表单骗不了后果。
不必把自己活成手册:说清要什么、一次做一块、仓库里留点规矩、关键路径自己过目、讲不清的别往公网推。
谁分得清「能扔」和「要养」,谁就在用 AI 写软件;谁把 Accept All 直接送上域名,谁只是在更快地堆一堆以后骂自己的东西。
出处与延伸:Karpathy 原帖、Fowler · Vibe Coding、Willison 的区分、GitLab AI 开发手册。