基于 Cursor 的 Web 背单词应用开发实战

后端开发

前端框架搭好后，开始设计后端 API 和数据库。Cursor 会给出清晰的项目结构建议。

项目结构

典型的 Flask 项目结构如下：

app/
├── models/
│   └── models.py
├── routes/
│   └── word_routes.py
├── utils/
└── app.py
requirements.txt
.env

环境参数

创建 .env 文件存储敏感配置，如数据库连接 URI：

DATABASE_URL=mysql+pymysql://root:root@localhost/word_memorize
FLASK_ENV=development
FLASK_APP=app/app.py

数据库设计

主要涉及两张表：Word 存储单词信息，UserProgress 存储学习进度和错题。先创建数据库：

CREATE DATABASE word_memorize CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

具体的建表语句可以让 Cursor 后续生成代码时一并处理。

安装 Python 依赖

项目根目录下的 requirements.txt 列出了所需依赖：

Flask==2.0.1
Flask-SQLAlchemy==2.5.1
Flask-CORS==3.0.10
PyMySQL==1.0.2
python-dotenv==0.19.0
requests==2.26.0

执行以下命令安装（注意：如果使用虚拟环境，需手动激活后执行）：

pip install -r requirements.txt

运行应用

启动服务：

flask run

首次运行可能会遇到版本兼容问题，别慌，把报错信息丢给 Cursor，让它帮忙修复。比如提示升级 Flask 版本，或者修改导入方式。经过几次迭代调整依赖版本和代码逻辑后，服务就能正常启动了。

最终启动成功：

前端代码修改

后端跑通后，需要修改前端 JavaScript 代码以对接 API。这里同样可以使用 Cursor 辅助生成或修改代码。

测试前端界面

修改完成后刷新页面，可能会遇到 CSS 或 JS 路径找不到的问题。这通常是资源加载路径配置不当导致的，让 Cursor 检查并修复路径引用即可。

接收所有建议后，可能需要运行一个静态文件服务来确保前端资源正确加载。

测试数据生成

为了让应用可用，我们需要一些初始单词数据。让 Cursor 生成 SQL 脚本插入测试数据。

添加单词时可能会报错，排查后发现是某些字段约束或连接问题。经过一番调试，数据终于成功写入。

功能测试

基本流程走通：单词展示、切换下一个单词、加入错题本等功能均显示正常。

Bug 修复

虽然界面上显示'加入错题本成功'，但实际数据库中并未持久化。这是典型的前端状态与后端逻辑不一致的问题。

需要 Cursor 深入检查后端代码逻辑。修复重启后，发现错题记录被答题记录覆盖。这是因为事务提交顺序或逻辑判断有误。再次引导 Cursor 关注这一冲突点，修正了更新策略后，错题本功能终于稳定运行。

总结

这个简单的示例项目完整展示了 AI 辅助开发的闭环流程。通过实践，我有几点体会：

1、交互策略 与 Cursor 沟通时要具体明确，复杂需求拆分成小步骤反馈。不要指望一次生成完美代码，迭代修正才是常态。

2、效率提升 善用上下文管理，保持对话连贯性。对于已验证的代码片段要懂得复用，建立自己的提示词模板能进一步提速。

整个过程中，AI 充当了资深结对编程伙伴的角色，极大地降低了环境搭建和基础编码的时间成本。