你是否想过拥有一个属于自己的个人网站，却不知道从哪里开始？
这篇文章不讲代码，只讲逻辑——搞清楚这 4 个问题，你就已经比 80% 的新手走得更远了。

---

写在前面

现在的 AI 工具（Claude Code、Cursor、ChatGPT）已经强大到可以帮非技术人员搭出一个完整的个人网站。但很多人卡在这里：网站做出来了，却上不了线；或者上线了，却不知道怎么更新内容。

问题不出在 AI，出在没有建立对"这件事全貌"的认知。

下面 4 个问题，是我在实际操作过程中梳理出来的核心概念。看懂这些，后面的操作你才不会迷路。

---

Q1：用 AI 搭网站，有哪些通用技巧？闭环的关键是什么？

先想清楚，再开口问 AI

AI 不会主动帮你规划，它只响应你的描述。很多人一上来就问"帮我做个网站"，然后来来回回改了十几轮，效率极低。

正确做法：先把下面 3 件事想清楚，再写提示词。

• 网站定位：个人作品集？技术博客？产品展示？工具合集？
• 视觉风格：深色/浅色？配色偏好？有没有参考网站？
• 内容模块：需要哪几个板块（首页、项目、博客、工具……）？

把这 3 件事整理成一段完整描述交给 AI，比边做边改效率高 10 倍。

闭环的 4 个关键节点

做网站这件事，有 4 个必须打通的节点，缺一不可：

① 网站能在本地跑起来
   在你自己电脑上启动测试，看到页面正常显示
         ↓
② 网站能打包成静态文件
   把代码打包成可以上传的成品文件（HTML/CSS/JS）
         ↓
③ 网站能部署到服务器
   代码推送到 GitHub，托管平台自动拉取并上线
         ↓
④ 内容能由你自己持续更新
   不需要再问 AI，自己能改文件或写文章

四个节点全部打通，才算真正闭环。 很多人卡在③，网站本地做好了却上不了线；或者卡在④，上线了却只能靠 AI 才能改内容。

实用技巧

• 每次只描述一个需求，做完验证没问题，再提下一个，避免 AI 把多个改动搞混
• 出错时把完整报错信息粘贴给 AI，不要只说"出错了"，AI 需要看到具体错误才能排查
• 用 Git 保存每个可运行状态——Git 是一个版本管理工具，每次提交（commit）相当于给当前状态拍了张"快照"。如果后续改动把网站搞坏了，可以随时回退到上一个正常版本，不会丢失之前的工作

---

Q2：AI 生成的网站，可以自己持续更新内容吗？

完全可以。 而且一个结构良好的网站，日常更新根本不需要再问 AI。

关键在于：内容和代码分开存放

结构良好的网站会把"内容"和"代码"分在不同的文件里。以下是本人最近搭建的一个网站：

content/（内容文件夹）
├── projects.ts     ← 改这里 = 添加/更新项目
├── tools.ts        ← 改这里 = 添加/更新工具
└── posts/
    └── 文章名.mdx  ← 在这里写博客文章

这些内容文件用 VS Code（或任何文本编辑器）就能修改，不需要懂代码，改的就是文字内容。

改完内容后，如何让网站更新？

这是很多新手的疑问。只需在终端（命令行）运行 3 条命令：

git add .                        # 把所有修改标记为"待提交"
git commit -m "描述这次改了什么"  # 保存这次修改（拍快照）
git push origin main             # 推送到 GitHub

推送成功后，Cloudflare Pages（托管平台）会自动检测到新推送，自动重新构建网站，约 2 分钟后更新上线。整个过程你不需要做任何其他操作。

你修改内容文件
      ↓
运行 3 条 git 命令
      ↓
GitHub 收到推送
      ↓
Cloudflare 自动构建（约 2 分钟）
      ↓
www.yourname.com 自动更新 ✓

两种更新方式

方式 A（推荐）：自己改文件
熟悉文件位置后，直接在 VS Code 修改内容，运行上面 3 条命令即可。长期维护成本极低。

方式 B：让 AI 帮写内容
把你的想法告诉 Claude Code/其他AI编程，让它们帮你写好项目描述或博客文章，复制粘贴进对应文件，再运行 3 条命令推送。

---

Q3：要用个人域名，注册商有哪些？怎么迁移？

常见域名注册商

注册商	特点	推荐指数
Cloudflare Registrar	按成本价，无续费溢价，自带 DNS 管理	⭐⭐⭐⭐⭐ 强烈推荐
Namecheap	价格实惠，界面友好	⭐⭐⭐⭐ 入门首选
GoDaddy	知名度高，但续费价格贵	⭐⭐ 不推荐长期用
阿里云 / 腾讯云	中文界面，国内项目必选，需备案	⭐⭐⭐⭐ 国内场景

域名命名建议：

• 简短好记，与你的名字或方向相关
• 优先选 .com，其次 .dev / .ai
• 避免数字和连字符，不易记忆

以 Cloudflare 为例：三步绑定域名

第①步：注册域名
Cloudflare Dashboard → Domain Registration → 搜索并购买域名

第②步：部署项目到 Cloudflare Pages
会得到一个临时访问地址，如：my-site.pages.dev

第③步：绑定自定义域名
Pages 项目 → Custom Domains → 输入你的域名
→ DNS 自动配置 → 5 分钟内 SSL 证书生成
→ 用你的域名访问，上线完成

如果域名和托管在不同服务商（比如域名在 GoDaddy，项目在 Vercel）：
只需在域名注册商的 DNS 管理页，添加一条 CNAME 记录，指向托管平台提供的地址即可。两者完全可以分开。

---

Q4：代码仓库、托管平台、域名，三者什么关系？

很多人把这三件事混在一起，用一个类比来彻底说清楚：

GitHub（代码仓库）  =  图书馆
                       保存你所有的代码历史记录
                       可以随时查看、回退、复用

Cloudflare Pages（托管平台）  =  你家的房子
                                  真正运行网站、对外提供访问的服务器

www.yourname.com（域名）  =  你家的门牌号
                              用户在浏览器输入的地址

Cloudflare DNS  =  邮局地址本
                   把"门牌号"翻译成"实际服务器地址"

四者的协作流程

用户输入 www.yourname.com
         ↓
DNS 查询（"这个门牌号对应哪台服务器？"）
         ↓
找到 Cloudflare Pages 服务器（你家的房子）
         ↓
服务器返回网页内容
         ↓
用户看到你的网站

当你更新网站时：

你修改代码 → git push → GitHub（图书馆存档）
                ↓
Cloudflare Pages 自动从 GitHub 拉取新代码
                ↓
重新构建并更新"你家房子里的内容"
                ↓
用户再次访问，看到新版本

三个关键结论

① 三者可以在不同服务商，互不绑定
域名在 Cloudflare，托管在 Vercel，代码在 GitHub——完全没问题，用 DNS CNAME 记录连起来就行。

② 换托管平台不用重新买域名
改一条 DNS 记录，指向新的托管地址即可。

③ GitHub 只是"存代码的地方"，不等于网站服务器
很多新手以为代码推到 GitHub 网站就自动上线了——不对，GitHub 只是仓库，真正把网站跑起来的是托管平台（Cloudflare Pages / Vercel 等）。

---

小结：开始行动前的清单

在动手之前，用这个清单检查自己是否想清楚了：

• 我的网站定位是什么？（博客 / 作品集 / 产品展示）
• 我希望有哪几个板块？
• 我有大概的视觉风格偏好吗？
• 我是否打算用个人域名？
• 我的内容面向国内用户还是国际用户？

想清楚这些，下一步就可以开始动手搭建了。

下篇将给出从 AI 生成网站到绑定域名上线的完整操作手册，附图示流程，跟着做就能完成。

---

本文基于 Claude Code + Next.js + Cloudflare Pages 的实际搭建经验整理，适用于非技术背景的读者。