一个专为 EnglishPod 学习者设计的打卡记录工具,帮助你追踪每节课的学习进度,并根据艾宾浩斯遗忘曲线自动提醒复习时间,让记忆更牢固。
数据全部存储在本地浏览器中,无需注册、无需后端。(AI说Recorder听起来像录音机,所以应该叫English Tracker才对)
打卡日历
- 月视图日历,周一起始
- 点击任意历史日期,右侧卡片实时显示该日的学习内容
- 有打卡记录的日期显示圆点标记
课程库
- 日历下方展示 EnglishPod 完整课程列表(365 课,含 Elementary / Intermediate / Upper-Intermediate / Advanced 四个级别)
- 支持按标题/编号搜索,按级别筛选
- 响应式网格布局,分页浏览(10/20/50/100 条/页),从详情返回时页码保持不变
- 点击课程卡片进入详情页,查看完整对话文本及节目文字稿(按需加载)
- 详情页支持上一课/下一课导航
- 详情页"单课打卡"按钮:打卡成功后自动弹出单课分享卡片;若已关闭,点击"分享"按钮可再次打开
当日学习内容
- 右侧侧边栏顶部,默认显示今天的学习内容
- 点击日历日期后切换为所选日期
- 展示该日各课程编号及学习次数
- 内含"打卡"按钮,点击弹窗录入当日记录(按 Enter 快速确认)
学习记录
- 按日 / 按周 / 按月三种维度查看
- 按日视图支持删除单日课程记录
- 底部显示打卡次数、总学习遍数、涉及课程数汇总
- 支持导出 JSON 备份 / 导入恢复数据
- 可将当前视图记录截图保存为 PNG 分享
复习提醒
- 基于艾宾浩斯间隔(1、2、4、7、15、30、60 天)计算每门课的下一次复习日期
- 复习进度动态计算,补录历史数据后自动调整:
- 以该课最早打卡日期为起点
- 有记录的不同日期数 - 1即为已完成复习轮次(同一天多条记录只算一次)
- 下次复习日:若理论日期未到则使用理论日期;若已过期且今天已有记录则顺延至明天,否则为今天
- 仅展示近 3 天内需要复习的课程,超过 3 条可展开查看
- 过期提醒(理论复习日期已过但未完成)以温暖琥珀光晕显示,优先级突出但不焦虑
- 支持单课程重置复习起点,重置前二次确认并说明效果
- 点击右上角 ⚙ 图标展开复习设置:全局遗忘曲线系数(0.5 ~ 3.0)调整及 7 次复习日期预览
- React 19 + Vite 8 + TypeScript(strict 模式)
- SCSS Modules + 语义化 CSS 变量 token 体系
- dayjs(日期处理)
- html2canvas(PNG 导出)
- localStorage(数据持久化,无后端)
cd app
npm install
npm run dev