闪卡学习应用

一个基于Flask和HTML/CSS/JavaScript开发的闪卡学习应用，支持用户创建、管理和学习闪卡，提供学习统计和进度追踪功能。

功能特点

• 📱 响应式设计：适配桌面和移动端设备
• 👤 用户认证：支持注册、登录和JWT认证
• 📁 分类管理：创建、编辑、删除闪卡分类
• 📝 闪卡管理：创建、编辑、删除闪卡，支持搜索和筛选
• 📚 学习模式：翻转卡片学习，记录学习结果
• 📊 学习统计：查看学习进度和统计数据
• ⚙️ 用户设置：自定义学习目标和模式

技术栈

后端

• Python 3.6+：主要开发语言
• Flask：Web框架
• Flask-JWT-Extended：JWT认证
• SQLite：轻量级数据库
• Flask-CORS：跨域资源共享

前端

• HTML5：页面结构
• CSS3：样式设计
• Tailwind CSS：CSS框架
• JavaScript (ES6+)：交互逻辑
• Font Awesome：图标库
• Chart.js：数据可视化

项目结构

.
├── backend/                 # 后端代码
│   ├── data/               # 数据目录
│   │   └── database.db     # SQLite数据库文件
│   ├── __pycache__/         # Python编译缓存
│   ├── app.py               # 应用入口
│   ├── auth.py              # 认证相关路由
│   ├── config.py            # 配置文件
│   ├── models.py            # 数据模型
│   ├── requirements.txt     # 依赖列表
│   ├── routes.py            # API路由
│   ├── start.sh             # 启动脚本
│   └── utils.py             # 工具函数
├── frontend/                # 前端代码
│   ├── lib/                 # 外部库文件
│   ├── app.js               # 前端主逻辑
│   ├── index.htm            # 主页面
│   └── style.css            # 样式文件
├── .gitignore               # Git忽略文件
└── README.md                # 项目说明

安装和运行

后端

1. 安装依赖

   cd backend
   pip install -r requirements.txt

2. 配置环境变量

   cp .env.example .env
   # 编辑.env文件，设置所需环境变量

3. 启动应用

   # 使用Python直接运行
   python app.py
   
   # 或使用启动脚本
   chmod +x start.sh
   ./start.sh

前端

1. 直接打开

   # 使用浏览器直接打开
   open frontend/index.htm
   
   # 或使用本地HTTP服务器
   python -m http.server 3000
   # 访问 http://localhost:3000/frontend/index.htm

API端点

认证相关

• POST /api/auth/register - 用户注册
• POST /api/auth/login - 用户登录
• GET /api/auth/profile - 获取用户信息
• POST /api/auth/refresh - 刷新令牌

分类管理

• GET /api/categories - 获取分类列表
• POST /api/categories - 创建分类
• GET /api/categories/<id> - 获取单个分类
• PUT /api/categories/<id> - 更新分类
• DELETE /api/categories/<id> - 删除分类

闪卡管理

• GET /api/flashcards - 获取闪卡列表
• POST /api/flashcards - 创建闪卡
• GET /api/flashcards/<id> - 获取单个闪卡
• PUT /api/flashcards/<id> - 更新闪卡
• DELETE /api/flashcards/<id> - 删除闪卡

学习相关

• GET /api/study/next-cards - 获取下一组学习卡片
• POST /api/study/submit - 提交学习结果

统计相关

• GET /api/statistics/overview - 获取统计概览

健康检查

• GET /health - 健康检查端点

使用说明

1. 注册/登录：首先创建账号或登录
2. 创建分类：在"分类"页面创建闪卡分类
3. 添加闪卡：在"闪卡"页面添加闪卡到分类
4. 开始学习：在"学习"页面选择分类开始学习
5. 查看统计：在"统计"页面查看学习进度和统计数据
6. 自定义设置：在"设置"页面调整学习设置

开发说明

数据库模型

• User：用户信息
• Category：闪卡分类
• Flashcard：闪卡信息
• StudyRecord：学习记录

部署建议

1. 使用Gunicorn：生产环境建议使用Gunicorn作为WSGI服务器

   gunicorn app:app -b 0.0.0.0:9000

2. 使用Nginx：配置Nginx作为反向代理

3. 使用Docker：容器化部署

贡献指南

1. Fork项目
2. 创建功能分支 (git checkout -b feature/AmazingFeature)
3. 提交更改 (git commit -m 'Add some AmazingFeature')
4. 推送到分支 (git push origin feature/AmazingFeature)
5. 打开Pull Request

许可证

本项目采用MIT许可证 - 查看 LICENSE 文件了解详情

联系方式

• 项目地址：https://github.com/GoofySatoshi/flash-card.git
• 作者：GoofySatoshi
• 邮箱：3033562734@qq.com

更新日志

v1.0.0 (2025-12-25)

• 初始版本
• 实现了基本的闪卡学习功能
• 支持分类管理和闪卡管理
• 提供学习统计功能
• 响应式设计，适配移动端

---

闪卡学习应用 - 让学习更高效，记忆更轻松！ 🚀