从零搭建个人网站全流程分享（Namecheap + Cloudflare + Vercel + AI 生成）

[qianfuzi13]

最近用 AI 工具 + 静态部署搭了个小站，过程中整理了一份从零开始的部署流程，分享给同样想建站的朋友。如果有疏漏欢迎指正，也欢迎交流优化建议～

网站地址放在文末，纯技术分享，无商业推广 😄

---

一、域名注册（ Namecheap ）

• 注册平台：Namecheap（全球知名，价格透明，常有新人优惠）
• 注册提示：
  • 支持国内邮箱注册，如未收到验证码请检查垃圾邮件
  • 查询心仪域名是否可注册
  • 支付建议选 PayPal （支持绑定银联卡），注册周期按需选择（我选的 1 年）

---

二、DNS 解析（ Cloudflare ）

虽然 Namecheap 自带 DNS ，但更推荐用 Cloudflare ，优势明显： ✅ 全球 CDN 加速，尤其服务器在海外时提升显著
✅ 免费套餐含自动缓存、静态资源优化
✅ 支持自动 HTTPS 、Brotli 压缩等实用功能

🔗 控制台： https://dash.cloudflare.com （支持简体中文，可用 Google 账号快捷登录）

配置步骤：

1. 左侧菜单 → 域 → 添加站点 → 输入域名 → 选择 Free 计划
2. 系统会自动同步旧域名的解析记录（新域名则跳过）
3. 复制 Cloudflare 分配的 Nameserver 地址
4. 回到 Namecheap：Domain List → Manage → Nameservers → 粘贴保存
5. 返回 Cloudflare 点击 完成，并开启以下优化：
   • Automatic HTTPS Rewrites
   • Always Use HTTPS
   • Brotli 压缩
6. 等待 DNS 生效（页面显示 Active 即可）

📌 小知识：

• Namecheap：负责域名所有权 + 设置 Nameserver
• Cloudflare：负责 DNS 解析（ A/CNAME 记录）+ 流量调度 + 安全加速

---

三、网站生成（ AI 工具 + Vercel ）

我用的方案：

• 🎨 页面生成：v0.app（ Vercel 官方 AI 工具，免费额度有限，按需充值）
• 💡 备选方案：Kimi（免费额度更友好，适合轻度使用）

两者都能通过自然语言描述生成前端代码，对新手非常友好

---

四、代码托管（ GitHub ）

1. GitHub 右上角 + → New repository
2. 建议设为 Private（按需选择）
3. 本地提交代码（ Git 基础操作，不熟悉的朋友可搜索「 Git 入门教程」）

---

五、Vercel 部署 & 域名绑定

1. 登录 Vercel 控制台 → Add New → Project
2. 导入 GitHub 仓库 → 点击 Deploy（静态页面通常无需额外配置）
3. 部署成功后：
   • 先用 Vercel 赠送的 .vercel.app 域名测试
   • 进入 Domains 添加自定义域名
   • 建议同时配置 example.com 和 www.example.com，并设置 301 重定向减少跳转

同步解析到 Cloudflare：

• Cloudflare 控制台 → DNS → Records → 添加记录
• 按 Vercel 提示添加两条 CNAME/A 记录（带 www 和不带 www ）
• 保存后等待 SSL 证书自动签发（通常几分钟内）

⚠️ 常见问题：

提交代码后 Vercel 未自动部署，提示：
No GitHub account was found matching the commit author email address

✅ 解决方案：检查本地 Git 邮箱是否与 GitHub 账号一致

git config --global user.email "你的 GitHub 绑定邮箱"```，重新提交即可触发部署。

## 小结
整个流程：域名注册 → DNS 解析 → AI 生成页面 → GitHub 托管 → Vercel 部署，全程可用免费/低成本方案完成。适合想快速上线个人项目、作品集或实验性站点的朋友。
如果流程中有不清楚的地方，欢迎留言讨论～
也欢迎帮我看看小站有没有体验问题
👉 https://y2kfashion.games

[SayHelloHi]

域名可以看看 spaceship porkbun cloudflare 这三家的域名价格可以

[jkshh1234]

纯静态直接 Cloudflare Pages