2.1 为什么校园小工具首选 Web 架构

上一部分，我们把 Vibe Coding 的准备工作基本铺好了：知道怎么和 AI 协作，知道环境要能跑，知道需求要写清楚，也知道要把角色、流程、数据、异常和验收讲明白。

接下来，问题就变得具体了。

如果我要做一个校园小工具，到底该做成什么形态？

是继续写一个单独的 HTML 页面？

是写一个 Python 小脚本？

是打包成一个桌面软件？

还是做成一个 Web 项目？

答案不是“Web 永远最好”。更准确地说：当一个校园工具需要多人使用、长期保存数据、跨设备访问和持续维护时，Web 通常是最稳的选择。

不是所有需求都要做成 Web

先把边界说清楚。

如果你只是想把一份 Excel 里的学生名单整理一下，批量改个格式，生成几张统计表，一个 Python 脚本可能就够了。

如果你只是想做一个课堂演示页面，比如让学生拖动图形观察变化，一个单 HTML 页面也很好。它简单、直接，拷到哪里都能打开。

如果你要控制本机硬件，或者做一个只在自己电脑上运行的专用工具，桌面程序也有它的价值。

所以本书不是劝你“万物皆 Web”。

真正需要换思路的，是这些校园现场：

• 教务处、办公室、机房多台电脑都要用。
• 数据今天填了，明天还要继续查。
• 不同老师需要看到同一份最新数据。
• 后续功能可能会慢慢增加。
• 不想每次升级都把文件挨个发给同事。

一旦出现这些特征，单 HTML 和小脚本就会开始吃力。

几种做法各有边界

可以先用一个简单判断表把它们区分开。

做法	适合什么	容易卡在哪里
单 HTML 页面	课堂演示、静态展示、小交互	数据难长期保存，多人协作弱
Python 小脚本	批量处理文件、整理 Excel、自动化小任务	不适合直接给很多老师共同使用
桌面程序	本机工具、专用场景、离线软件	打包、杀毒误报、系统兼容和升级麻烦
Web 项目	多人访问、数据保存、统一维护、跨设备使用	需要理解前端、后端、数据库和部署

这张表不是考试知识点，而是帮你做取舍。

比如机房排座系统，如果只是打印一张固定座位表，Excel 也能做。

如果只是展示一张座位图，HTML 也能做。

但如果不同班级都要保存自己的座位表，老师要随时调整，刷新后数据不能丢，同事也要能查看，这就已经不是一个单页面能舒服解决的问题了。

它开始需要 Web。

浏览器是学校里最通用的客户端

为什么 Web 在校园里特别合适？

因为浏览器几乎到处都有。

办公室电脑有浏览器。机房学生机有浏览器。教室一体机也有浏览器。很多时候，手机和平板也能打开网页。

这意味着你不需要让每位同事安装一个新软件，也不需要解释“请先解压，再运行这个 exe，如果杀毒软件拦截请点允许”。

对需要自己维护小工具的老师来说，这一点非常重要。

学校里的工具，最怕的不是功能少一点，而是每次用之前都要先解决一堆安装问题。一个工具如果打开门槛太高，很快就会被放回角落。

Web 的入口就简单得多：

打开浏览器，输入地址。

这句话对大多数老师都能讲得通。

统一维护比到处发文件省心

单 HTML 页面有一个很大的优点：简单。

但它也有一个明显问题：一旦你发给了很多人，文件就散出去了。

今天你修了一个 Bug，明天还要提醒同事重新下载。有人下载了新版，有人还在用旧版。再过一段时间，你自己也可能记不清哪个才是最新文件。

Web 项目的思路不一样。

项目放在一台电脑、服务器或内网环境里，大家访问的是同一个入口。你修改的是项目本身，同事刷新浏览器后看到的就是新结果。

这就像学校统一更新一个通知页面，而不是把 Word 文件一份份发到各个群里。

入口集中，维护成本就会低很多。

从单 HTML 迁移到 Web 并不浪费

很多老师已经会写一点 HTML，或者会让 AI 帮自己做一个静态页面。

这不是弯路。

恰恰相反，它是很好的起点。

因为 Web 项目的前端部分，本来就离不开 HTML、CSS 和 JavaScript。你以前做过的页面、按钮、表格、拖拽效果，并不会被推翻。它们只是从“一个单独文件”逐步进入一个更完整的项目结构。

可以这样理解：

单 HTML 页面像一间临时教室。

能上课，能演示，灵活方便。

Web 项目像一间正式功能室。

它有门牌，有水电，有档案柜，也有后续维护规则。

当你的需求从“我自己演示一下”变成“大家长期一起用”，就该考虑把临时教室升级成正式功能室。

判断时先问三个问题

以后遇到一个校园需求，不妨先问自己三个问题：

• 这个工具是不是要给不止一个人使用？
• 这个工具是不是要长期保存数据？
• 这个工具是不是要在不同电脑或不同地点打开？

如果三个问题里有两个答案是“是”，那它就很适合往 Web 项目方向考虑。

机房排座系统显然符合。

它不是一次性脚本。它要服务多个班级，要保存学生和座位关系，还要让老师能在办公室、机房甚至教室里查看。

所以我们选择 Web，不是因为它听起来高级，而是因为它更贴合学校现场。

想继续查，可以认这些词

这一篇先用人话帮你判断“什么时候该选 Web”。如果后面想继续补技术概念，可以从这些词开始查。

本文里的说法	专业技术名词	可以按需了解什么
单独一个网页文件	静态页面 / Static Page	HTML、CSS、JavaScript 如何组成一个页面
小脚本处理名单或表格	脚本 / Script	Python 脚本、批处理、自动化任务
打包后双击运行的软件	桌面应用 / Desktop App	打包、安装包、系统兼容、杀毒误报
浏览器打开就能用的系统	Web 应用 / Web App	浏览器、服务器、前端、后端
使用者打开工具的地方	客户端 / Client	浏览器为什么也叫客户端
大家访问同一个入口	部署 / Deployment	项目怎样从本机走向可访问环境
后续统一修改和升级	维护 / Maintenance	为什么项目要考虑长期维护成本

先选入口，再拆黑盒

到这里，我们先完成一个认知判断：校园小工具不一定都要 Web，但排座系统这类需要多人访问、数据保存和持续维护的工具，优先选 Web 是合理的。

不过，选了 Web 以后，新的问题马上来了。

老师在页面上点击“保存座位表”，数据到底去了哪里？

为什么刷新以后还在？

为什么一个页面不能自己把所有事情都办完？

下一篇，我们就从一次最普通的“点击保存”开始，把 Web 项目这个黑盒拆开，看清前端、后端、接口和数据库是怎么接力的。

封面