零代码免费上线个人站：AI 生成 + GitHub + Pages

作者：@天选嘉鲤敦赵图图



【作者】天选嘉鲤敦赵图图
【原视频】https://www.bilibili.com/video/BV1jFVK6yEH9
【简介】零基础免费个人站流程：AI 出第一版 HTML/CSS/JS → GitHub 仓库 → 免费托管自动部署；先静态上线再迭代。

【口播要点】
我是真被评论区起效了
所以这期视频我就专门讲清楚
一个完全没有基础的新手
怎么从零开始
免费搭建一个属于自己的网站
第一步
用AI生成第一版
你可以直接对AI说
帮我做一个个人网站首页
用HTML
CSS
JavaScript
包含头像
简介作品展示和联系方式
风格简介高级
适配手机端
它会给你生成几个文件
index.html
style.css
script.js
这三个文件就是一个最基础的网站
如果你想做的高级一点
可以用next.js
towand.css
virtual这一套
但如果你是传新手
我建议第一版先做静态站
先上线
先能访问
先能发给别人看
第二步
把代码放到github
github可以理解成你网站代码的仓库
你把代码传上去
然后连接virtual
或者cloudflare pages
连接以后
你每次改代码
平台都会自动重新部署
不用登陆服务器
不用FTP上传
不用手动重启服务
如果你这一步不会
可以继续分你的AI
它会告诉你什么是github
并帮你建立仓库和推送
第三步
免费部署上线
如果你是HTML
CSS.js静态站
用cloudflare pages
如果你是next.js
react这种网站
用virtual
如果你只是最简单的个人主页
也可以用github pages
部署成功以后
平台会送你一个免费的网址
比如XXX.pages.app
或者XXX.virtual.app
到了这一步
你已经有了一个
真正能访问的网站了
而且一分钱都没花
第四步
如果你需要数据库
可以继续使用superbase
比如你的网站要收集用户提交
保存评论
展示排行榜才需要数据库
这个时候可以用superbase的免费层
但注意
新手第一版网站
能不用数据库就不用数据库
能静态就静态
能简单就简单
第五步
要专业一点
再买预名
免费网只能用
但不够正式
如果你想让网站看起来
更像一个品牌
就买一个自己的预名
这可能是整个戒战流程里
唯一真正建议花钱的地方
买完预名以后
把DNS接到Cloud Flare
再绑定你的Virtual
或者Cloud Flare Patches项目上
这么说也不用你买
HTTPS自动配置
最后稍微扫个忙
Cloud Flare是全球最大的
网络安全和CDN公司之一
Gatehub是全球程序员
放代码的地方
Virtual是Nex.js
背后的部署平台
Superbase是全球最多独立开发者
和出创团队在用的数据库
和后端服务
他们都有自己的安全和规中心
并被全球开发者认可
部署于任何也级平台
好了
本期的分享就到这里
我们下期再见
拜拜

【备注】新手向实操指南。