01 · 项目介绍
广民工具箱是什么、给谁用、解决什么问题——项目教程的开篇
💡 TL;DR：广民工具箱（tools.guangmin.top）是一个以「本地处理」为核心卖点的在线工具站——文本处理、图片压缩、证件照、文件打包等 13 款免费工具全部在浏览器里完成计算，文件不上传服务器。支撑它的是一套 pnpm monorepo 骨架（三个应用 + 三个共享包），本教程系列会把它从头到尾讲清楚。
一、广民是什么
广民是邹城市广民网络科技站（个体工商户）的线上产品，目前由三部分组成：
| 组成 | 地址 | 一句话定位 |
|---|---|---|
| 工具箱 | tools.guangmin.top | 13 款免费在线工具，打开即用，本教程的主角 |
| 主站 | guangmin.top | 品牌门户 + 文章板块 + 本教程（/docs） |
| 小程序 | 微信内 | 与网页端共用账号与积分（灰度准备中） |
二、为什么做它
市面上在线工具站很多，但几乎都走同一条路：把你的文件传到服务器，处理完再传回来。这带来三个问题——隐私焦虑（截图、证件照、内部文档敢传吗）、速度慢（上传下载双倍时间）、成本高（服务器带宽要钱，最终要么限免重要会员）。
广民工具箱的答案是换一条技术路线：浏览器本身已经具备完整的数据处理能力（Canvas 画图、WebAssembly 跑原生代码、文件读写 API），对大部分工具场景来说，服务器根本不需要参与。于是：
- 图片压缩在你点下按钮的那一瞬间就在你电脑里完成了；
- 儿童入园照的抠图模型（12.2MB）下载到浏览器本地运行，照片从头到尾没离开过你的设备；
- ZIP 打包解压直接读写你选的文件，服务端只负责把这个页面递给你。
这就是整个项目最核心的设计决策：能用本地算的绝不上传。付费工具线（文档转换、音视频转文字等必须调用云端大模型的能力）是这条线的例外，灰度开放中，本教程聚焦免费部分。
三、适合谁用 / 谁能从本教程学到东西
工具的使用者：不需要任何技术背景，打开 tools.guangmin.top 就能用，全免费无次数限制。
本教程的读者：适合有一定编程基础、想看「一个真实产品是怎么做出来」的同学。你会看到——
- monorepo（单仓库多包）工程怎么组织，为什么这么组织；
- 前后端契约（接口类型的唯一事实源）怎么设计、怎么用 CI 强制执行；
- 13 款工具各自的技术实现拆解（Canvas、WebAssembly、fflate、MediaPipe……）；
- 单机生产环境的部署、质量门禁与发布闭环。
每一章都配图和真实参数，跟着读完你可以把这套骨架复刻到自己的项目里。
四、本教程怎么读
- 想快速了解全貌：读完 01~02 就够了；
- 想复刻这套骨架：按 03 → 04 → 05 → 06 顺序读；
- 只对某个工具感兴趣（比如「儿童入园照是怎么抠图的」）：直接跳右侧「工具实现揭秘」分组，每篇独立成文。
五、先看一眼效果
打开 tools.guangmin.top/tools：左侧是分类菜单（文本 3 / 图片 3 / 转换 3 / 生成 1 / 开发 3），点任意工具进入工作页。以「图片压缩」为例——拖入图片、看压缩前后体积对比、点下载，全程没有上传进度条，因为根本没有上传。