# 不会写一行代码，我用codex给自己做了个网站，全程0元 | 建站系列【1】
**作者**: Modengsir AI
**日期**: 2026-07-06T14:36:16.000Z
**来源**: [https://x.com/ModengSir/status/2074140378618290488](https://x.com/ModengSir/status/2074140378618290488)
---
## 前言：
最近很多小伙伴都在搭建自己网站，再加上这几天发推说看到大佬@Saccc_c的一篇文章《个人网站，是你上手 Codex 的最好项目》，早就有搭建一个自己网站的想法，说干就干，从网上找教程，问AI，问L总@Lonely__MH 关于注册搭建的问题，原来自己搭建0元免费网站是这么简单。
言归正传，今天就简单说下如何利用codex搭建个人免费网站流程，同时也是你上手codex的最好项目。让不会代码的小白照样可以有自己的网站，劝退的小伙伴赶紧回来自己搞网站啦！
你有没有过这样的念头： 想有一个自己的网站——放个人主页、作品集、或者一个小工具站——但一想到"写代码""买服务器""搞域名"，就默默放弃了？
我告诉你一个好消息：2026年了，建网站真的不再是程序员的专利。
我自己也不会写代码。但我用 codex加上一个GitHub账号,一个Vercel账号 免费工具，一个晚上就把自己的网站做上线了，全程没花一分钱，连域名都是白送的。
这篇文章，我把完整流程一步步拆给你看。你只需要会打字、会复制粘贴，就能照着做出来。
## 你需要准备的东西（除了codex，其他全部免费）
在开始之前，先列个清单：
1. 一个AI助手：ChatGPT、Claude、DeepSeek、Kimi codex 用哪一个都可以，它负责帮你写代码，我用codex
2. 一个GitHub账号：用来存放代码，稍后教你注册
3. 一个Vercel账号：用来把代码变成真正能访问的网站
4. 30分钟时间
看到GitHub和Vercel这两个陌生名字别慌，你现在只需要知道一句话：
> GitHub是存代码的网盘，Vercel是把代码变成网站的机器。
它们具体是什么、还能干什么，我会在系列的下一篇文章里详细讲。今天咱们先把网站做出来，先尝到甜头。
## 第一步：让codex帮你把网站写出来
别被"代码"两个字吓到。在AI时代，写代码的活儿交给AI，你只需要负责一件事：把需求说清楚。
你习惯用什么Ai就用什么。我用codex来讲解
打开codex,把下面这段提示词直接复制过去（可以按自己需求修改）：
简单版测试：
> 帮我做一个个人主页网站，要求：
> 所有代码写在单个HTML文件里
> 包含3个部分：个人介绍，项目产品，联系方式
> 风格简约现代白底大气，深题
> 手机上打开也能正常显示
> 给我完整代码，不要省略任何部分
复杂版就是以后你大概要的样子
> 帮我做一个个人主页网站，要求：
> 所有代码写在单个HTML文件里
> 包含9个部分：头部导航栏（固定悬浮）首屏IP形象区（个人 IP 形象 + 一句话定位）个人介绍AI 项目产品知识库GitHub合作联盟联系方式页脚版权
> 风格：白底极简科技资讯封面风 / 黑橙高对比扁平线稿风
> 手机上打开也能正常显示
> 给我完整代码，不要省略任何部分
实操开始
这里有个关键点：一定要强调"单个HTML文件"。因为对新手来说，一个文件是最容易上传和部署的形式，不会出现文件之间互相找不到的问题。
【特别需要注意事项：codex默认生成文件名 你要改成 index.html，否则vercel部署的时候出现404页面，我因为这个找了半天问题，最后找到是这个问题，改完就好了】
Codex会给一个完整的html文件，如果用其他编程软件可能给你的是代码，那你需要复制创建一个文本文件贴进去，参考下面教程
你不需要看懂任何一行，只需要：
1. 点击代码框右上角的"复制"按钮
2. 在电脑上新建一个文本文件
3. 粘贴进去
4. 保存，务必把文件命名为 index.html， vercel它认这个名字
⚠️ 新手最容易踩的坑：文件名必须是 index.html，注意后缀是 .html 而不是 .txt。如果你用的是Windows记事本，保存时要把"保存类型"选成"所有文件"，再手动输入 index.html。
保存好之后，双击这个文件，浏览器会打开它——这就是你网站的样子了。
不满意？直接回去跟AI提要求：
- "导航栏改成蓝色"
- "加一个放头像的位置"
- "项目展示改成卡片式排版"
AI会给你新的完整代码，你重新复制保存覆盖即可。这个过程就像捏脸，可以反复调到满意为止。
来咱们欣赏下刚设计的简单的网站
再来看看复杂版本的网站效果
是不是这个效果更好一些。更接近你想要的效果
最后， 我都没有选择，我又重新优化了一个版本。
## 第二步：注册GitHub，把代码传上去
网站文件做好了，但它现在只在你的电脑上，别人访问不了。接下来要把它放到云端。
GitHub（github.com）是全球最大的代码托管平台，你可以把它理解为"代码界的网盘"。全世界的程序员都在上面存代码、分享代码。
注册很简单：
1. 打开 github.com，点击 Sign up
2. 输入邮箱、设置密码、起个用户名
3. 邮箱收验证码，填入，完成
注册好之后，我们来创建一个"仓库"（Repository）——你可以理解为网盘里的一个文件夹：
1.打开你注册好的github页面，点击页面右上角的 "+" 号，选择 New repository
2.仓库名随便起，比如 my-website
3.权限选择 Public（公开）
4.点击绿色按钮 Create repository
创建完成后，页面中间有一行小字 "uploading an existing file"，如下图，点它，然后把你的 index.html 文件拖进去，最后点击绿色的 Commit changes 按钮。
到这里，你的代码已经安全地躺在云端了。
## 第三步：用Vercel，让全世界都能访问你的网站
现在到了最神奇的一步。
Vercel（vercel.com）的作用一句话就能说清：你给它代码，它还你一个全世界都能访问的网址。 不需要买服务器，不需要懂任何运维知识，而且个人使用完全免费。
操作流程：
1. 打开 vercel.com，点击 Sign Up
2. 选择 Continue with GitHub——用刚才的GitHub账号直接登录，两个平台自动打通,或者之前都单独注册过账号，就按我下面发的操作
3. 登录后点击 Add New → Project📷
登录自己gitehub账号，选择个人网站项目，
4.你会看到刚才创建的 my-website 仓库，点击旁边的 Import
5.接下来的设置页面什么都不用改，直接点击 Deploy
等待大约30秒，屏幕上会撒花庆祝🎉——你的网站上线了。
Vercel会送你一个网址，
https://my-website-sable-psi-31.vercel.app/
这就是我网址的链接，大家可以欣赏
这是一个真实的、全球可访问的网址。你可以发给朋友，挂在社交媒体简介里，写进简历。
更爽的是：以后你在GitHub里更新代码（比如让AI改了版重新上传），Vercel会自动检测到，自动重新部署，网站几十秒内就更新了。 你完全不用管。
## 国内用户必须知道的两件事
流程讲完了，但作为面向国内读者的教程，有两个现实问题必须提前告诉你：
第一，vercel.app 的网址在国内部分网络环境下访问不稳定。
有的地区秒开，有的地区打不开。解决办法是绑定一个自己的域名（一年几十块钱），配合Cloudflare做解析，访问会稳定很多。
我测试了 自己手机不开魔法，网址打不开，后面给大家讲用自己买的域名去做解析的教程。
第二，如果你的网站是认真面向国内用户运营的。
比如想被搜索引擎收录、想跑流量，那最终还是绕不开国内服务器+ICP备案这条路，这时候就轮到腾讯云这类国内云服务商出场了。
这两个话题各有不少细节和坑，我会在这个系列的后续文章里分别用整篇的篇幅讲透。
## 总结
回顾一下今天的完整流程：
> AI写代码 → 上传GitHub → Vercel一键部署 → 网站上线
- 成本：0元
- 时间：30分钟【我走了弯路，codex生成网页名字 一定要是 index.html】
- 门槛：会打字、会复制粘贴
如果你今晚有半小时空闲，现在就可以照着做一遍。做出来的第一个网站可能很简陋，但那种"我居然真的有自己的网站了"的成就感，会推着你继续往下学。
## 下期预告
这篇文章里出现了GitHub、Vercel，后面还会用到Cloudflare、腾讯云。这四个平台到底各自是干什么的？什么情况该用哪个？免费路线和国内正规路线怎么选？
下一篇《做网站前必看：GitHub、Vercel、Cloudflare、腾讯云到底是干嘛的？》，我用"开餐厅"的比喻，一次给你讲明白。
我是 @modengsir 用codex零基础建站系列持续更新中。 如果这篇对你有帮助，欢迎转发给同样想建站的朋友。
## 相关链接
- [Modengsir AI](https://x.com/ModengSir)
- [@ModengSir](https://x.com/ModengSir)
- [4.2K](https://x.com/ModengSir/status/2074140378618290488/analytics)
- [@Saccc_c](https://x.com/Saccc_c)
- [@Lonely__MH](https://x.com/@Lonely__MH)
- [github.com](https://github.com/)
- [github.com](https://github.com/)
- [vercel.com](https://vercel.com/)
- [vercel.com](https://vercel.com/)
- [https://my-website-sable-psi-31.vercel.app/](https://my-website-sable-psi-31.vercel.app/)
- [vercel.app](https://vercel.app/)
- [@modengsir](https://x.com/@modengsir)
- [Upgrade to Premium](https://x.com/i/premium_sign_up)
- [10:36 PM · Jul 6, 2026](https://x.com/ModengSir/status/2074140378618290488)
- [4,231 Views](https://x.com/ModengSir/status/2074140378618290488/analytics)
- [View quotes](https://x.com/ModengSir/status/2074140378618290488/quotes)
---
*导出时间: 2026/7/7 08:15:36*