目标用户：英语自学爱好者、备考学生、希望利用碎片时间提升词汇量的学习者。
核心价值：提供一个轻量化的英语学习工具，帮助用户通过每日打卡和单词学习养成持续学习习惯，解决传统背单词App“学了就忘、缺乏坚持动力”的痛点
应用场景：
日常单词学习：用户可以在通勤、午休等碎片时间打开网站，通过卡片式交互快速学习新单词
学习进度追踪：通过每日打卡功能，用户能看到自己的学习轨迹，形成正向激励
移动端适配：响应式设计让手机和电脑都能获得良好体验，真正实现“随时随地学”
1. 用户认证系统（JWT）
用户注册/登录，支持JWT身份验证
登录态保持，无需重复登录
2. 单词学习模块
卡片式展示：单词以卡片形式呈现，包含单词、释义、例句
学习交互：底部设置“认识/不认识”两个按钮，用户可标记掌握程度
学习进度：记录已学单词和待学单词数量
3. 每日打卡功能
用户完成当日学习任务后可打卡
打卡记录持久化保存，形成学习日历
连续打卡天数激励用户坚持
4. 进度追踪
统计总学习单词数
展示学习进度百分比
可查看历史学习记录
技术实现
层级 技术选型 说明
前端框架 React 组件化开发，高效管理UI状态
样式方案 Tailwind CSS 快速构建响应式UI，适配移动端和PC端
后端框架 Node.js + Express 轻量级API服务
数据库 SQLite 轻量数据库，适合中小规模应用，便于部署
认证 JWT（JSON Web Token） 无状态用户认证
AI辅助开发 Claude Code 全程使用Claude Code辅助开发，涵盖脚手架生成、组件编写、API开发、bug修复等环节
项目结构示意：
text
english-learning-site/
├── client/ # React前端
│ ├── src/
│ │ ├── components/ # 单词卡片、打卡组件等
│ │ ├── pages/ # 首页、学习页、个人中心
│ │ └── App.jsx
│ └── package.json
├── server/ # Node.js后端
│ ├── routes/ # API路由（认证、单词、打卡）
│ ├── models/ # 数据模型
│ └── index.js
└── README.md
评论