第一章结束，承上启下
你会亲手碰上纯前端网站的问题：存进去的东西，一刷新就没了。碰过之后，你自然会想要一个能记住数据的后端，下一关 Phase 2 就给你这个。
回头一题
这道题不考这一节，考前面学过的。想不起来就回去翻一眼再答——记不住的东西，真用的时候一样会卡。
第一次 push 时，终端让你输密码却怎么都不对，最可能是什么原因？
你已经把 Steve's Repair 官网上线了(1.10),好看、能打开、有公开链接。但纯前端网站有个问题绕不过去。这一节我不先解释，你自己动手试一次，就明白了。
动手：存一条留言，然后刷新页面
下面是一个模拟的网页,就当它是你的 Steve's Repair 官网，顾客能在上面留一条预约信息。照着做三步，别光看:
- 在输入框中输入一句话，点"存一条",多存两三条,看它们排进下面的列表里。
- 留意一下右上角的状态灯，现在是灰的:没有后端。
- 点橙色的"刷新页面"按钮。它模拟你按浏览器刷新、或者关掉网页明天再打开。看会发生什么。
给 Steve 留一条预约
存的时候一切正常，列表里清清楚楚几条留言；一刷新，页面转一下，回来全没了，一条不剩。这不是模拟器做得不好，真实的纯前端网站就是这个样子。换句话说：你刚上线的那套 Steve's Repair 官网，现在要是加个留言框，顾客填的预约信息，关掉页面就全没了。这就是纯前端的天花板。
为什么会这样：网页"住"在你的浏览器里
到现在为止，你的网站只有前端,也就是浏览器里看到、点到的那一层。前端负责显示和交互：把页面画出来、响应你的点击。它没有长期保管数据的地方。你存的留言只是临时放在浏览器内存里，刷新等于把这一页从头重新加载，内存一清空，留言就没了。像在白板上写字，擦一下就不在了。
要让数据留下来,刷新还在、换台电脑还在、别人也能看到，就得在前端背后加一层:后端。后端有个专门记东西的仓库，也就是数据库。前端把数据交给它保管，下次打开再向它要回来。
你现在有的
浏览器里看到的页面
负责：显示画面、响应点击
做不到：长期保存数据
刷新就丢
你还缺的
看不见，但一直在后台
负责：把数据存进数据库
负责：谁登录、谁是管理员
右边那半是虚线加灰的，因为你现在还没有它。点下面的按钮把后端接上，再回模拟器试一次，自己看两回有什么不一样。
动手(第二轮):把后端"接上",再存一次
点下面的"接上后端"，给模拟器接一个假后端（它把留言存进浏览器自带的本地存储里，冒充真数据库的记性）。接上之后，右上角状态灯会变绿。然后把刚才那套动作再做一遍：回到上面存几条留言、点"刷新页面"。这一次留言还在。后端干的就是这件事：替你记住东西。
切换后端的接 / 拔，自己对比两种情况下刷新的区别:
现在是：没有后端，刷新就丢。
接上后端，刷新后该长什么样
怕自己看走眼？下面给你一张对照表。同样存三条留言、同样点刷新，两回回来是这样:
刷新后
列表空了，显示"还没有留言"。
计数变回"当前 0 条留言"。
刷新后
三条留言原样还在列表里。
计数仍是"当前 3 条留言"。
拿这张表对一下你刚才看到的：没接后端，刷新回来列表是空的；接上后端，刷新回来留言原样还在。两种都自己试过，后端是干嘛的你就明白了。
记住数据、能登录、有管理员后台，纯前端都做不到，得靠后端。下一关 Phase 2 给你接上一个真后端:Supabase,一个托管好的数据库加登录系统。你不用自己造服务器，像这一关指挥 Agent 一样，把"记住东西"交给它就行。
自检：模拟器里那几步，你真做过吗
下面四条，对着你刚才在模拟器里真做过的事一条条勾。看懂了不算，得真点过、真看到了才勾。勾不上的那条，回上面再做一遍。
动手做完一条勾一条，四条都勾上，这一关就过。
- 存了留言、点刷新却好像没变化：确认你是先存了两三条看到它们进列表,再点橙色"刷新页面"那个按钮，不是按浏览器自己的刷新。
- 接上后端后刷新留言还是没了：接上后端会先清空重来保证对比干净，所以要在接上之后重新存几条再点刷新，别拿接之前存的那几条来比。
- 状态灯没变绿：点的是那块里"接上后端"那个按钮(不是"拔掉后端"),点一下灯就该绿。
临走前一测
同班同学说:"我给官网加了留言框，顾客留的言关页面就没了。" 最该给他补上的是什么？
一章之前，你还不知道网页是什么。现在你手里有一个别人点开就能看的公开链接——你定的内容、你指挥它做的、你自己验收过的。
你报名的时候想的那件事，"把我有个想法变成我做出来了、链接在这"——前半句你已经做到了。下一章补上"而且它能记住东西、能给真人用"。
还没想清前端和后端怎么分工，或者好奇 Supabase 是怎么把留言记住的？把疑问发到群里问问大家，或者直接向 Abel 或助教提问。这一节不要求你现在就会写后端。你只要真切感觉到纯前端卡在哪、明白为什么得有后端，就够了。