1. 介绍

跟着这篇做完,你会得到一个可以公开访问的个人网站。它可以有首页、作品页、关于页,也可以扩展成简单博客、项目介绍页或作品集。 后续更新时,你只需要继续告诉 Codex 要改什么,它就能帮你修改文件、提交到 GitHub,并触发 Vercel 自动重新部署。

这是一篇简单基础的静态网站教程,适合个人主页、作品集、博客入口、产品介绍页等轻量场景。如果你要做登录、后台、支付或复杂数据库应用,就不属于这篇教程的范围。

2. 创造网站

2.1 找到想要的风格

  • 如果你有想要的风格,可以直接和 Codex 说。
  • 如果你有对标的网址或者截图,也可以发给 Codex。
  • 如果都没有,可以先在下面的参考模板网站找找灵感:

2.2 开始创造

现在 Codex 的 GPT-5.5 模型已经非常聪明了,不需要复杂的提示词,只需要把参考截图或者参考网址发给 Codex,并让 Codex 帮你参考模板制作就可以了。

建议先把首页做好。首页满意后,再让 Codex 根据首页风格补齐 About、Articles、Projects 等内页。 这样不光能节省 Token,速度也会更快。

有什么不满意的地方,直接告诉 Codex 修改;如果你不知道该怎么改,也可以让 Codex 给你几个方案。

3. 部署网站

3.1 准备工作:安装 GitHub 插件

部署前,先在 Codex 的插件页安装 GitHub 插件并完成授权:

  1. 打开 Codex 的插件页面。
  2. 找到 GitHub 插件。
  3. 点击安装。
  4. 按照提示登录 GitHub 并完成授权。
  5. 授权完成后回到 Codex,确认 GitHub 插件已经可用。
Codex 安装 GitHub 插件流程截图
安装并授权 GitHub 插件后,Codex 才能帮你写入仓库。

3.2 半自动部署提示词

把下面这段话发给 Codex,它就会读取提示词页面,并一步一步带你完成部署:

请读取这个页面里的提示词,并按它一步一步带我完成部署:
https://kqw.ai/prompt/deploy-website.html

3.3 创建 GitHub 仓库

登录 GitHub,点击左上角的 New 创建仓库。你需要输入仓库名字,并根据自己的需求选择公开或私有。

如果你做的是作品集、个人主页这种展示站,可以选择公开仓库。如果你不想公开源代码,可以选私有仓库;但这不代表网站内容是私密的,部署后的网站仍然可能公开访问。

  1. 打开 GitHub 并登录账号。
  2. 点击左上角的 New 创建新仓库。
  3. 在 Repository name 里输入仓库名字。
  4. 根据自己的情况选择 Public 或 Private。
  5. 其他选项保持默认即可。
  6. 点击 Create repository。

创建仓库后,页面会自动跳转到新仓库。复制仓库地址,直接发给 Codex 即可。

GitHub 仓库创建流程截图
创建仓库后,把仓库地址直接粘贴给 Codex。

3.4 部署到 Vercel

打开 Vercel,建议直接使用 GitHub 登录。登录后选择 Import Git Repository,导入刚才创建的网站仓库。

  1. 打开 Vercel。
  2. 选择使用 GitHub 登录。
  3. 点击 Add New Project 或 Import Project。
  4. 找到刚才创建的网站仓库。
  5. 点击 Import。
  6. 如果是普通静态网站,大多数设置保持默认即可。
  7. 点击 Deploy,等待部署完成。

部署完成后,把 Vercel 生成的线上地址直接发给 Codex,让它帮你检查网站是否正常访问。

Vercel 导入 GitHub 仓库并部署的流程截图
Vercel 会从 GitHub 拉取网站文件并自动部署。

4. 以后怎么更新网站

第一次部署跑通后,后续更新会简单很多。你每次让 Codex 修改网站后,只需要让它把改动提交并推送到 GitHub:

请检查当前网站项目的改动,告诉我会提交哪些文件。
确认无误后,帮我 git add、commit、push 到 GitHub。

提交信息用:
Update site
网站后续更新流程截图
只要代码推送到 GitHub,Vercel 通常会自动重新部署。

5. 可选项:绑定自己的域名

Vercel 部署成功后,会先给你一个可以直接访问的免费网址。你也可以把这个网址发给 Codex,让它帮你检测是否部署成功。 如果你想使用自己的域名访问,可以继续在 Vercel 里绑定域名。

  1. 在 Vercel 项目里找到 Domains 设置。
  2. 输入你自己的域名。
  3. 按照 Vercel 给出的提示修改域名 DNS。
  4. 等待域名解析生效。
  5. 访问自己的域名,确认网站可以正常打开。
Vercel 绑定自定义域名流程截图
绑定域名需要按 Vercel 的提示去域名服务商处修改 DNS。

FAQ

Codex 生成的网站文件保存在哪里?

Codex 会把网站文件保存在你当前使用的本地项目文件夹里。你可以直接问 Codex:“这个网站项目保存在哪里?”它会告诉你具体路径。

本地预览地址和正式网站地址有什么区别?

本地预览地址一般是 http://127.0.0.1:xxxx,只能在你自己的电脑上查看,适合修改网站时实时预览。 正式网站地址是 Vercel 部署后生成的网址,别人也可以通过这个网址访问。

没有自己的域名可以发布网站吗?

可以。Vercel 部署成功后会自动给你一个免费网址,不绑定自己的域名也可以正常访问。

GitHub 仓库选择公开还是私有?

如果你做的是作品集、个人主页、项目展示页,可以选择公开仓库。如果你不想让别人看到网站源代码,可以选择私有仓库。

私有仓库是不是代表网站内容不会被别人看到?

不是。私有仓库只代表别人看不到你的代码,不代表别人看不到你部署后的网站。只要网站部署后的访问地址是公开的,别人依然可以打开网站页面。

Vercel 部署失败一般可能是什么原因?

常见原因包括仓库没有推送成功、Vercel 没有权限读取仓库、Root Directory 选错、项目不是静态网站但构建命令为空,或环境变量缺失。 失败时把 Vercel 的错误提示发给 Codex,它通常能判断下一步该怎么修。

修改网站后,为什么线上网站没有变化?

通常是因为修改还只停留在本地,没有提交并推送到 GitHub。你需要让 Codex 把改动 commitpush 到 GitHub,Vercel 才会收到更新并重新部署。

后续每次更新网站都需要重新部署吗?

不需要手动重新部署。正常情况下,只要 Codex 把最新代码推送到 GitHub,Vercel 就会自动重新部署网站。

不会 Git 命令还能完成部署吗?

可以。你不需要自己记 Git 命令,只要告诉 Codex 你要提交并推送网站改动,它会一步一步带你完成。

可以用这个方法做博客吗?

可以做简单博客,比如文章列表、文章详情页、个人写作合集。但如果你想要后台编辑、评论系统、会员权限等功能,就不属于这篇教程里的简单静态网站范围了。

可以用这个方法做带后台、登录、支付的网站吗?

不建议用这篇教程的方法直接做这类网站。后台、登录、支付通常需要数据库、服务器和更严格的安全配置,已经不是简单静态网站了。