? 最近很多人都开始使用Cursor辅助开发,我自己也尝试了下,发现确实好用,有了解放生产力的感觉,可以快速验证自己的想法,因此想写文记录一下,等三个月或者半年后再来看看这篇文章,对比下AI领域或者AI编程领域的发展。我这次开发的微信小程序叫“瞅瞅今天吃什么”,大家有兴趣的可以去微信搜搜看看?? 在24年12月8号的时候就想写这篇文章了,无奈事情太多,周末也都没有时间做这些事情,所以一直拖到了今天(25年1月4号)? 这两年大模型发展起来后,我自己一直都想做一个小工具试试水,但是受限于大模型的编程能力和我自己薄弱的前端知识,这个想法就一直停留在开始阶段,没有继续深入做下去。随着Cursor和一系列AI编程工具的出现,大幅降低了写代码的门槛,因此我又重拾起了做小工具的想法。 为什么做这款小程序呢,还是因为日常生活中,周末宅在家的时候,老是不知道中午吃啥或者晚上吃啥,因此想着做个小程序,让小程序帮我决策。 既然要开发微信小程序,那么微信开发者工具肯定是需要的,下载链接可见https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html。然后呢,我们还需要使用Cursor帮助我们开发,所以需要下载Cursor客户端,下载链接见https://www.cursor.com/。注意,Curosr是收费的,订阅制,新注册账号有免费试用的额度。如果免费试用额度不够,可以考虑去淘宝上组个共享账号。(共享账号有跑路风险,需自己斟酌)。 初始化项目,使用微信开发者工具新建工程就可以了。 项目初始化完成后,我们后续的开发工作都是通过Cursor实现的,微信开发者工具的主要作用就是预览和调试。 下载后登录Cursor,使用Cursor打开我们的工程。Cursor也是基于VScode开发的,因此其前端界面和VScode非常像,在正式开发前,我们可以先看下Cursor主要功能。 Cursor左侧是整个工程目录,中间部分展示我们的文件内容,右侧是与AI大模型对话的窗口,我们就是通过对话的方式来进行代码开发的。在对话过程中,我们可以选择对话的大模型。这里,我还是建议大家一直使用Claude-3.5-sonnet-20241022这个模型,其编码能力是最强的。 我们可以先在工程目录下新建一个Readme.md文件,描述下当前工程是做什么的,我的Readme.md文件内容如下: 后续在通过对话进行开发时,可以把这个Readme文件勾选上,这样可以避免对话内容过长时大模型忘记了我们最终要实现什么内容。 现在我们直接对话,让大模型帮我们开发这个小程序。 大模型很快就帮我们返回了结果,点击apply就可以直接生成这个文件(注意目录位置是否准确)。不过,由于我们没有勾选其他文件,大模型当前不知道app.ts等文件,微信开发者工具已经给我们创建好了,我们不需要重新创建,所以,我们可以重新发起一轮对话,该对话中可以选中一些已有的文件(尽量少让大模型改动无关文件,改动的越多,出错的机率越大)。 这次,我们让大模型修改我们工程中已有的index页面文件(index页面是官方模板中提供的一个默认登录页,打开小程序后就会直接展示该页面,我们这个小程序暂时不需要登录功能,因此我们让大模型直接修改这个页面即可)。修改完成后,我们可以把大模型生成的内容直接粘贴到原始文件中。PS:有的时候,大模型只生成了文件中需要修改的那部分,其余的没有直接给出,那么我们可以直接让大模型给出某个文件的完整内容即可。 将大模型生成的内容粘贴到原始文件后,我们像看下渲染效果,那么我们直接Ctrl+S保存当前生成的代码,然后打开微信开发者工具,就能看到实时渲染的结果了。如果觉得渲染结果不符合预期,我们也可以把这个页面截图给大模型,让他按照我们的要求继续修改。修改过程中,修改目的尽可能单一且明确,改动的文件越少,准确率越高。 注意:考虑到大模型生成的内容不一定完全准确,我们可以使用Git管理我们的代码仓库,以便回滚。 当前小程序已经发布上线,整个过程中,开发耗时是最短的,半天的时间就OK了,反而是后续的备案、认证流程用了很多时间。大家可以在微信上搜索“瞅瞅今天吃什么”或者扫描下方二维码体验下小程序。当前小程序还比较简陋,大家有什么建议或者意见可以随时提出,欢迎讨论。
背景
开发过程
前置准备
初始化项目
Cursor登场
正式开发
这是一个微信小程序,其核心功能是给用户推荐吃什么。
## 主要功能
- 午餐推荐
- 晚餐推荐
- 个性化设置
## 界面设计
主界面采用简约设计风格:
- 顶部显示"今天吃什么?"大标题
- 副标题"让我来帮你决定!"
- 三个主要按钮:
- 午餐(配有咖啡杯图标)
- 设置(齿轮图标)
- 晚餐(餐具图标)
- 推荐加载时显示"等待美食推荐..."的提示
## 技术特点
- 简洁的用户界面
- 随机推荐算法
- 可自定义设置成品
优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!
优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站、APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。