前言

年前分享了一篇《Cursor：前端不会消失，但前端的你会消失 - 掘金》的文章，主要向大家展示了Cursor在前端开发过程中的能力，当时讨论还是比较热烈的。

不知道大家后续是否有所尝试，反正，我已经逐渐将 Cursor 作为主力开发工具了。Cursor协助我完成了很多项目的开发工作，包括前端界面、数据库设计、Java开发、Python脚本、甚至还包括移动端小程序——《Cursor实战回顾：花慧小程序开发 - 掘金》。

与 Cursor 协同开发真的“爽”，我可以投入更多的时间去理解业务，优化设计，美化界面，而不是把时间花费到语法记忆、样式代码上去。

给我的感觉是：我终于是一个工程师，而不是码农了。

言归正传，今天就给大家分享下使用 Cursor 进行日常开发案例，场景内容有所简化，大家关注核心思路即可。

背景及任务

背景

我们正在搭建一个团队内部技术人员协同提效的平台，平台致力于尽可能多地将工作自动化、智能化，让技术人员释放更多时间从事更加重要的事情。

整个项目基于SpringBoot+Element UI实现，技术框架是在各种开源组件上面进行了进一步封装，数据库采用的MySQL。

该功能开发时，平台已经实现了基础模块，Cursor 可进行参考实现。

任务

我们有很多已经上线的项目正在运行，随着团队的发展，项目越来越多，一个项目经理服务多个项目的情况司空见惯，这种情况下，我们希望实现一个模块来辅助管理这些上线项目（上线项目后续称为“应用”）。

本次分享主要就是基于该场景向大家展示如何通过 Cursor 完成“应用”模块的开发。

操作过程

开发环境、Cursor安装等步骤就不再赘述，我们直接进行进入流程。

分析设计

应用模块需求：

• 实现应用信息的基础管理（增删改查），包括：关联的项目、所用资源（服务器等）、项目经理、应用名称、应用描述、应用类型（Web、App、小程序）、应用描述、应用状态（未上线、正常运行、异常）、上线时间、上次启动时间、备注。
• 为了美观，列表页面不使用普通表格，而是使用卡片模式。

建表SQL

一次性获取结果或者简单问答，我一般使用Chat模式，响应较快。

上下文选择了我们之前已有的一个建表sql。

提示词：

sql
 代码解读
复制代码
请参考给出的sql，帮我设计“应用信息”模块基于mysql的sql，表名为：yw_app_info：
应用信息包括：关联的项目、所用资源（服务器等）、项目经理、应用名称、应用描述、应用类型（Web、App、小程序）、应用描述、应用状态（未上线、正常运行、异常）、上线时间、上次启动时间、备注。

结果：

基本的sql生成大家应该都有预期，但是除了这些，Cursor 还帮我们：

• 生成了合适的注释，并且非常合理地拆分了应用类型和取值范围。
• 按照规范生成了表中的审计字段（create_by、create_time等）。
• 分析出来字典字段，并按照框架要求生成了字典类型、字典数据相关sql。

代码生成

初版

项目中已经有实现好的完整模块UpgradeRecord。

上下文选择“应用”的建表sql，使用Composer模式，后续一直使用该模式。

提示词：

 代码解读
复制代码
根据应用信息的建表语句，参考UpgradeRecord生成该模块的全部代码，包括前端和后端，代码存放位置和UpgradeRecord相同。

由于UpgradeRecord和应用是同一个大模块内的，所以此处指定代码位置非常简单，如果相同大模块中没有代码的，需要明确指出各部分代码位置。

结果：

输出结果很长，仅截取汇总部分。

是不是很惊艳，前后端一气呵成。

效果：

甚至，它还怪好地帮我对接了项目（已实现代码）下拉、用户弹窗。

大部分场景，初版一次性就能完成整个模块的开发，但实际开发的多了，一定会碰到有些不完美的情况。此时，我们可以根据需要接受代码后，再通过对话直接调整即可，比如下面的“美化界面”场景。

构造数据

美化界面前，我们先构造一些测试数据让界面看起来充实点。

提示词：

 代码解读
复制代码
为应用信息生成5条测试数据，project_id范围为1。manager_user_id范围为1-5的任意整数。

其中范围后面为已存在模块的id。

效果：

唯一一条不正式的数据是我自测用的，这演示效果，不比个人手动录入半天好用。

美化界面

前面任务中说明了，列表页面不使用表格，我们来美化一下。

提示词：

 代码解读
复制代码
为了美观，应用信息的index.vue页面直接使用卡片样式，不需要分页，并美化按钮及搜索区域

效果：

第一次美化时，只是把表格改为了卡片，然后第二次我就指定美化按钮及搜索区域，这次结果还可以。

总结

这个案例还有需要优化的地方，但是，以上过程，大家应该已经可以体会到 Cursor 协同开发的方便之处了。

很多时候，Cursor 除了基础的回答外，还会超出预期的帮你思考更多的事情，这样一个代码助手，还不上吗？