主题
第 12 章 综合演练:从空文件夹到上线网址
本册所有技能,一次串起来。这套十步,也是你未来一切新项目的骨架。
- 新建文件夹
hello-web,用 VS Code 打开它。 - 让 Claude 插件生成一个最小的个人主页——就一个
index.html,越简单越好(这个文件本身,第三册第 2 章正好拿来解剖)。 - 在源代码管理面板点"初始化仓库"(它背后就是
git init——给这个文件夹装上时间机器)。 - add、commit,写下第一条存档说明:"最小主页"。
- GitHub 网页建一个空仓库
hello-web(复习:不勾任何初始化选项)。 - 念三行咒语:
remote add origin、branch -M main、push -u origin main。刷新网页,确认代码上云。 - 打开 Vercel,Add New Project,Import 这个仓库,一路默认,Deploy。
- 一分钟后,拿到一个
xxx.vercel.app网址——发给爸爸,让他在手机上打开。这是你从零上线的第一个网站。 - 回到 VS Code,把主页标题改一个词,add、commit、push。切到 Vercel 看着它自动重新构建、部署——第一册第 11 章画的那条流水线,此刻在你眼前真实转动。
- 彩蛋(可选,做完等于提前修了第四册第一课):去 Cloudflare,给我们的域名加一条 CNAME 记录指向这个 Vercel 项目——让它拥有一个真正属于我们的网址。
走完这十步,回头看:VS Code(1、2、9)、Git 四步循环(3、4、9)、GitHub 建仓上传(5、6)、部署流水线(7、8、9)、DNS(10)——本册和第一册在这里合龙。
关键领悟
从空文件夹到全世界可访问,十步、半小时。这件事在十年前需要一个团队。门槛已经消失了,剩下的只是把这十步走熟。