一个真正能用的学习工具，从想法到上线
“作案动机”
在我的专业学习里，高数是绕不开的一门学科。期末复习的时候，把不同学校的卷子找来研究一下对复习非常有效。
但问题是：试卷散得到处都是。
有些在微信聊天记录里
有些在网盘，下载了忘了放哪
有些是上课时遇到的，拍完照存在相册里
有时候卷子找到了，找不到答案
有时候答案找到了，自己重新做了一遍的解题过程又不知道放哪里
于是我就想：能不能把这些东西统一管理起来？
一个页面里同时看到“试卷 + 标准答案 + 我自己做了一遍的解答”，不用来回切换找文件。翻起来方便，复习效率也会高很多。
这，就是整个项目的作案动机。
我想做一个什么样的东西
一开始我的需求很简单：
每套试卷能配上它的答案和我的解析
都在一个页面里，一看就明白
上传要方便，不折腾
后面慢慢细化成这些：
首页能看到所有试卷，展示缩略图
点进去是三栏对照：试卷 / 标准答案 / 我的解答
图片可以点击放大看，能缩放、能拖动
后台可以随时添加、编辑、删除试卷
有公告功能，可以给访问者发消息
个人信息可以改，头像能换，密码也能改
本质上就是：把学习资料整理成自己的知识库。
技术选型：为什么选 PHP + SQLite
众说周知，PHP是世界上最优秀的语言
而我手头上有好几台普通的虚拟主机。虚拟主机一般都支持 PHP，但 Python 或 Node.js 环境不一定有。
PHP：虚拟主机标配，上传就能跑，不用配置
SQLite：不需要单独装数据库，一个 .db 文件就搞定，备份直接复制走
这两个组合起来，用户下载代码后，访问 install.php 就能安装，然后直接用。没有依赖安装、没有环境配置，对非技术用户也比较友好，于是乎决定使用PHP＋SQLite。
目录结构
高数试题库/
├── admin/ # 后台管理
├── assets/ # 样式 + JS
├── database/ # 数据库文件（安装后生成）
├── uploads/ # 上传的图片
├── detail.php # 试卷详情页
├── index.php # 首页
└── install.php # 安装脚本
几个关键功能怎么实现的
三栏对照的详情页
详情页是核心功能。每套试卷进入后，左中右分别显示：
左栏：试卷图片
中栏：标准答案
右栏：我的解答
这三者是对应的。比如试卷第 3 页对应答案第 3 张和解析第 3 张，放在一起对比看，复习效率很高。
实现上，三栏是三个独立的图片列表，分别从数据库的三个 JSON 字段中读取。
图片预览器
试题图片一般有文字、公式，缩略图看不清，必须能放大查看。
我实现了一个全屏图片预览器：
点击任意图片进入全屏模式
滚轮可以放大缩小
放大后按住鼠标拖动可以移动图片
左右箭头切换同一组图片
底部有缩略图导航
动态详情页
每套试卷的详情页是动态生成的。
URL 格式：detail.php?id=1
系统根据 id 从数据库读取试卷数据，渲染出对应的页面。不需要为每套试卷手动创建 HTML 文件。
安装脚本
用户下载并上传代码后，访问 install.php，系统会自动：
创建 SQLite 数据库
建立所有表结构
写入默认数据（默认密码 admin123、默认公告等）
安装完成后，用户删掉 install.php 就可以开始用了。
后台管理
后台功能包括：
试卷管理：添加、编辑、删除试卷。添加时可以分别上传试卷图片、标准答案图片、我的解答图片
公告管理：编辑公告内容，设置是否自动弹窗
个人信息：修改姓名、简介、联系方式、头像
修改密码
后台有密码保护，默认密码是 admin123。
后台页面长这样：
项目的使用场景
这个项目不只是放高数题，它本质上是一个以图片为主的资料整理工具，可以用在很多地方：
整理各科试卷和答案
刷题复盘、错题记录
收集专业课资料
做个人的学习笔记库
只要内容是以图片为主的，都可以用这个系统来管理。
项目体验
https://love.uuk.pp.ua/（点击链接打开；链接不定时失效，如无法正常打开项目则默认体验地址取消）
开源地址
GitHub项目开源地址：https://github.com/HIWB/gaoshushitiku
MIT 许可证，可以自由使用、修改、商用。
如果你需要这样一个能自己上传、自己管理的试题库，欢迎下载使用。
一点感受
做这个项目花了不少时间，从最开始的想法，到设计数据库、写前后端、调试、部署、开源，中间遇到了不少问题，在几天时间里，反复修改整整八版才正式完成。但它真的跑起来，能用了，感觉还挺值的，不枉我每天苦寻月亮下山公鸡打鸣，可谓是：八易其稿，屡琢不休，一朝运转，尘埃落定。
它解决了我自己整理资料的需求，也让我把前端交互、后端逻辑、数据库操作、部署上线、完成开源走了一个完整的流程。
最后，本人无法保证项目能在任何设备完美运行，但还是斗胆一句：如果这个项目对你有帮助，欢迎GitHub上 ⭐ Star 支持！
有问题欢迎提 Issue 或直接联系我。
评论（0）
暂无评论