【Code with SOLO】用 SOLO 10 分钟搞定两门课的期末复习网站

【Code with SOLO】用 SOLO 10 分钟搞定两门课的期末复习网站

一、摘要

我是一名大学生,期末复习时需要整理概率论与数理统计和理论力学两门课的笔记和错题。原本手动整理需要很长时间,现在用 TRAE SOLO 从零开始,只需要一句话描述需求,就能自动生成精美的复习网站,包含完整笔记、错题解析、公式速查表、进度追踪等功能,大大提升了复习效率。

二、背景

我是一名理工科大学生,每学期期末都需要复习多门数学/物理课程。传统复习方式是手动整理 Word 文档或纸质笔记,存在以下痛点:

  • 数学公式难以漂亮呈现,手打公式费时费力
  • 笔记和错题分散在不同地方,查找不便
  • 无法跟踪复习进度,不知道哪些章节还没复习
  • 换设备复习时需要重新找资料

我希望能有一个网页版的复习资料,打开浏览器就能用,随时随地都能复习。

三、实践过程

3.1 任务拆解

我将整个任务拆解为以下步骤:

  1. 解压课程资料(zip 包含笔记 .md 和错题 .md)
  2. 读取并分析所有章节内容,提取笔记和题目
  3. 设计网站架构(风格、配色、交互功能)
  4. 生成单页 HTML(内联 CSS + JS + KaTeX 公式渲染)
  5. 部署到 GitHub Pages 实现在线访问

3.2 关键 Prompt

我只用了一句话就完成了第一个网站的生成:

“把这个做成一个复习网站”

SOLO 自动完成了:解压 zip 包 → 读取所有 .md 文件 → 设计网页风格 → 生成完整 HTML。第二个网站同理,只需上传新的课程资料即可。

3.3 踩坑与解决

部署过程中遇到了一些问题,通过与 SOLO 对话解决:

  • Gitee Pages 需要实名认证 → 换用 Netlify 匿名部署 → 最终用 GitHub Pages 解决
  • 公式渲染问题 → 集成 KaTeX CDN 实现完美的数学公式显示
  • 移动端适配 → 响应式布局 + 侧边栏抽屉式导航

四、成果展示

4.1 概率论与数理统计复习网站

涵盖 4 章内容(随机事件与概率、随机变量及其分布、多维随机变量、数字特征),含 12 道错题解析和 16 个核心公式。

概率论复习网站首页

笔记内容展示(KaTeX 公式渲染)

公式速查表(一键查看 16 个核心公式)

4.2 理论力学复习网站

涵盖 5 章内容(运动学、刚体运动学、质点动力学、非惯性系动力学、质点系动力学),含 30+ 道例题和习题。

理论力学复习网站首页

理论力学笔记内容(柱坐标系、极坐标系等公式)

侧边栏导航 + 进度追踪功能

五、技术亮点

  • 单文件架构:所有 CSS/JS 内联,零依赖,可离线使用
  • KaTeX 公式渲染:数学公式完美呈现,支持行内和单独显示
  • 响应式设计:手机/平板/电脑均可完美浏览
  • 题目折叠展开:先看题目再看解析,方便自测
  • 进度追踪:每章进度条 + 总进度百分比
  • 公式速查表:16-20 个核心公式一键查看
  • 滚动动画:fade-in 渐入 + 浮动装饰 + 渐变色 Hero 区域

六、效果与总结

原本手动整理复习资料至少需要 4-5 小时,现在用 SOLO 只需要上传资料并说一句话,10 分钟内就能生成完整的复习网站。而且生成的网站比手动整理的更好用:

  • 公式更清晰:KaTeX 渲染比 Word 公式编辑器更美观
  • 查找更快:目录导航 + 公式速查表,秒找知识点
  • 复习更高效:进度追踪 + 题目折叠,知道哪里还没复习完
  • 随时随地:手机平板电脑都能用,不用带书

SOLO 在整个流程中做了什么:

  1. 自动解压并解析课程资料(zip 包中的 .md 文件)
  2. 智能设计网页风格(根据用户偏好选择温暖活泼风格)
  3. 将 Markdown 内容转换为包含 KaTeX 公式的 HTML 结构
  4. 实现复杂交互功能(折叠、导航、进度、速查表)
  5. 帮助部署到 GitHub Pages 实现在线访问

这种工作流完全可以复用:任何课程的复习资料,只要上传包含笔记和题目的文件,就能一键生成同样精美的复习网站。


:package: 代码仓库GitHub - wang0495/exam-review-websites: 📚 概率论与数理统计 + 理论力学 期末复习网站 | 用 SOLO AI 一键生成 · GitHub
:globe_with_meridians: 在线预览概率论与数理统计 · 复习站

两个都看不到图

我这个是内嵌的github链接 可以直接去github看

1 个赞