这个案例从头到尾都在一个本地文件夹里完成。做的是一个宠物零食售卖的前端网页，做完发布到网上，别人点开链接就能访问。上篇讲页面怎么从零长出来，下篇再讲管理后台和宣传物料。
对刚上手的人来说，它最值得看的地方是节奏。每一步都先出计划，看过没问题再动手，改动全部进 Git，做完一版就发布一次。
先建目录，再让它出计划
在本地新建一个文件夹，命名成 Pet treats，然后在 Codex 里把这个文件夹选为工作目录。
开启计划模式，让它先生成一份初步的项目计划。计划看过没问题，再让它执行。跑完打开 index.html 预览，页面就出来了。
这一步值得多花几分钟。计划对了，后面改起来才不返工。
用 Git 把改动管起来
页面能看之后，先建一个 Git 仓库。它的作用是把每次改动都留档，后面加功能或者改细节出了岔子，随时能退回去。
细节优化可以在页面里直接用注释写要求。想改哪一处，就在那一处留一句注释，让它照着改。这种改法比反复描述位置快得多，也省掉来回截图解释。
加销量，加热销榜
页面基本成型之后开始往里加东西。增加月销量，新增一个热销榜。
这些改动都在同一个仓库里完成，推送之前先自己检查一遍有没有问题。改动只要落进 Git，就不怕后面对不上账。
发布到 GitHub Pages
先新建一个 GitHub 仓库，把仓库链接复制出来，让它把代码传上去。然后在仓库设置里找到 Pages，点击保存，等几分钟，页面会生成一条链接。这条链接别人可以直接打开。
这里有个边界要知道。GitHub Pages 适合托管静态网站，HTML，CSS，JavaScript 和静态资源都没问题。需要后端服务器，数据库或者敏感交易的业务逻辑，它跑不了。
访问的稳定性跟地区和网络环境有关。打不开可以先换网络，或者等部署完成之后再试一次。
再补登录和商品分类
上一步之后继续加功能。购买要填地址，就需要一个账号把这些信息存下来，于是新建用户登录注册页面。商品这边按宠物分类，再往下分食品分类。
这类改动依旧先用计划模式，先看它有没有理解需求，再动手。细节还是用注释提。选好食品加进购物车，点购买的时候要提示确认地址，这是下单流程里不能少的一环。
改动确认没问题，提交到 Git 保存。
上篇做到这里，页面已经能在网上打开，代码也进了仓库。接下来是后台，招商 PPT 和宣传视频。
