不懂代码也能搞定！从注册到上线，我把这套“个人网站”的万能公式拆碎了喂给你

来，既然喊我一声教练，那咱们就别整那些虚头巴脑的理论。

我知道你的痛点在哪：

是不是最近用 ChatGPT 还是 Claude 甚至 DeepSeek 蹭蹭蹭写出了一堆代码？哪怕是一个简单的“个人介绍页”或者“AI导航站”。代码有了，然后在电脑里躺着，你自己点开 index.html 看着挺爽，但发给别人，别人看不了。

你现在的状态就是：拿着金饭碗要饭。 产品做出来了，没摆上货架，谁给你买单？

很多人卡在这，觉得“部署”是程序员的事，要买服务器、要搞Linux命令、要备案……听我说，全都不需要。

今天我教你一套“白嫖流”打法：GitHub（仓库）+ Cloudflare Pages（门面）。

全程免费，不用备案，速度飞快，而且显得你特别专业。

这套SOP，我带过的小白，最快10分钟搞定。把你的秒表掐起来，我们开始。

---

核心逻辑：咱们到底在干啥？

别被英文吓到了。这就跟“发朋友圈”一个逻辑：

1. GitHub = 你的手机相册。你把代码（照片）先存到这，不仅安全，还能管理版本。
2. Cloudflare = 朋友圈/Instagram。它负责把你相册里的东西，展示给全世界看，还顺手帮你加了美颜（CDN加速）和安全锁（HTTPS）。

我们要做的，就是把这两边连上一根线。

---

手把手实操步骤

准备工作：

• 你的代码文件（比如 index.html）。
• 一个邮箱。
• 能科学上网的环境（做海外生意，这是基建）。

Step 1：搞定 GitHub（你的云端仓库）

别去学什么 git push 命令，那是给秃头程序员用的。咱们用网页版，简单粗暴。

1. 注册/登录： 打开 github.com。没账号就注册（Sign up），全是英文看不懂？右键“翻译成中文”。
2. 新建仓库：
   • 右上角找到那个 + 号，点击选择 New repository。
   • Repository name（仓库名）： 起个英文名，比如 my-first-web。
   • Public/Private： 选 Public（公开）。新手别折腾私有，公开最方便，反正你那是前端代码，不怕看。
   • 其他都不勾选，直接点击最下面的绿按钮 Create repository。
3. 上传代码（关键）：
   • 现在的页面也是一堆代码命令，别慌。
   • 找一行小字：uploading an existing file（上传现有文件）。点它。
   • 动作： 把你电脑里的 index.html、style.css 或者是图片文件夹，全部框选，直接拖进去。
   • 最重要的一步： 等进度条跑完，往下拉，看到 Commit changes（提交更改）这个绿按钮了吗？一定要点！ 不点就白传了。

Step 2：搞定 Cloudflare（你的全球门面）

这个网站是很多独立开发者的“神”。

1. 注册： 打开 dash.cloudflare.com，注册账号。邮箱验证一下。
2. 进入 Pages：
   • 左侧菜单栏，找到 Workers & Pages（有时显示为 Workers 和 Pages 分开，点 Pages）。
   • 点击蓝色的 Create application（创建应用）。
   • 点击 Pages 标签页，然后点击 Connect to Git（连接到Git）。
3. 授权连接：
   • 它会弹窗让你登录 GitHub，点击 Authorize Cloudflare（授权）。
   • 选刚才你创建的那个仓库 my-first-web。
   • 点击 Begin setup（开始设置）。
4. 一键部署：
   • 设置页面基本不用动。
   • Project name： 这是你域名的前缀，比如你填了 beihai-demo，你的网址就是 beihai-demo.pages.dev。
   • Branch： 默认 main 或 master，不用动。
   • Build command： 咱们是纯静态网页（HTML/CSS），这里留空。
   • 点击 Save and Deploy（保存并部署）。

Step 3：见证奇迹

盯着屏幕上的日志跑几秒钟。当看到绿色的 Success! 时，恭喜你。

屏幕上方会给你一个链接，长得像 https://xxxx.pages.dev。

点开它。

那一刻，你的网站已经在全球几百个节点上上线了。不管你在北京还是纽约，都能访问。发给你朋友装个逼，告诉他：“这是我做的站。”

---

避坑指南 (Warning)

这里有 3个 新手 90% 会踩的坑，我都替你踩完了：

1. 文件名地狱：
   你的主页文件必须叫 index.html。如果你叫 home.html 或者 1.html，Cloudflare 找不到门，打开就是 404 错误。必须全是小写，必须是index。
2. 文件夹套娃：
   上传到 GitHub 时，确保 index.html 在根目录（最外面）。
   • ❌ 错误：仓库 -> 我的网站文件夹 -> index.html
   • ✅ 正确：仓库 -> index.html
     如果你套了一层文件夹，你的网址就得加后缀才能访问。
3. 更新代码咋办？
   “北海，我改了个字，怎么更新？”
   很简单，回到 GitHub 那个仓库，点击 Add file -> Upload files，把你改好的文件再拖进去一次，再次点击 Commit changes。
   Cloudflare 那边会自动感知，自动重新部署。 全程自动化，这叫 CI/CD（持续集成/持续部署），这词学会了面试都能吹两句。

---

立即行动

别只顾着收藏，收藏了你也不会看。

现在，立刻，马上：

1. 让 AI 给你写一个简单的 HTML：“帮我写一个红色背景的网页，中间写上‘Hello World，我是[你的名字]’”。
2. 按照上面的步骤，把它部署上线。
3. 把生成的 .pages.dev 链接发给自己微信的文件传输助手。

做完这一步，你就从“想做网站的人”，变成了“拥有网站的人”。

这是本质的区别。

去干吧，有问题随时回来翻这篇复盘。等你跑通了这一步，下一回我教你怎么绑定自己的 .com 域名，彻底把品牌立住。

你还在犹豫什么？

现在就开始吧！