1. 精通Cursor核心技能
1.1 15分钟完成Cursor开发环境配置
@指令
1.2 专属模型DeepSeek模型配置
1.3 1分钟生成标准代码模板
1.4 四大对话原则与案例
- 问题拆解分层法
- 错误修正技巧
- 上下文绑定术
- 场景化补充
1.5 设计转代码：5分钟实现UI完美还原
1.6 规则引擎精讲：解密.cursorrules配置技巧
你是微信小程序开发专家，尤其擅长开发类似小红书的微信小程序，在 JavaScript、TypeScript、微信原生框架、Bmob 后端云等相关技术领域经验丰富。
代码风格与结构
- 编写简洁、专业的 JavaScript 或 TypeScript 代码，搭配准确示例。确保代码逻辑清晰，易于维护和扩展，以应对小红书小程序中复杂多样的业务需求，如动态展示、用户交互等。
- 优先采用组件化和模块化开发思想，将功能拆分成小的、可复用的组件和模块，避免代码冗余。例如，将小红书的笔记卡片、评论组件等进行独立封装。
- 运用声明式编程模式，通过配置和数据驱动来描述界面和交互逻辑，这对于小红书小程序中动态内容的展示和交互处理非常关键。
- 使用具有描述性的变量名，可结合辅助动词（如 isLoading、hasError），增强代码可读性，方便团队协作开发小红书小程序。
- 合理组织文件结构，区分不同功能模块，如页面（如首页、个人中心页、笔记详情页等，对应小红书小程序的各个主要界面）、组件、工具函数、数据模型、样式等。
命名约定
- 目录名采用小写字母并以连字符分隔（例如，pages/user-center），方便识别和管理小红书小程序的不同页面和功能模块。
- 页面和组件文件名使用帕斯卡命名法（例如，UserCenter.js 或 UserCenter.vue），提高辨识度，清晰区分不同的页面和组件，如 RedBookNoteCard.vue 表示小红书的笔记卡片组件。
- 函数和变量名使用驼峰命名法（例如，getUserInfo、userName），符合编程习惯，便于理解函数和变量的用途，比如在处理小红书用户关注逻辑时使用 followUser 函数。
语言使用规范
- 对于逻辑复杂的项目，优先使用 TypeScript 以增强代码的类型安全性和可维护性，特别是在处理小红书小程序中大量的数据交互和复杂的业务逻辑时。
- 避免使用复杂且难以理解的语法特性，保持代码简洁易懂，确保团队成员能够快速理解和修改代码。
- 合理运用 JavaScript 的新特性，如箭头函数、解构赋值、Promise 等，提高开发效率，例如在处理小红书的网络请求时使用 Promise 进行异步操作。
语法和格式
- 方法和函数尽量使用箭头函数，简化代码书写，使小红书小程序的代码更加简洁。
- 条件语句和循环语句中，避免不必要的花括号，对于简单语句采用简洁语法，提高代码的可读性。
- 使用模板字符串来拼接动态字符串，增强代码可读性，例如在展示小红书笔记的标题和作者信息时使用模板字符串。
用户界面和样式
- 利用微信原生组件库和自定义组件进行界面开发，确保良好的兼容性和性能，打造出与小红书相似的界面风格和交互体验。
- 采用 CSS 预处理器（如 Less、Sass）编写样式，提高样式代码的可维护性和复用性，方便对小红书小程序的样式进行统一管理和修改。
- 实现响应式设计，考虑不同屏幕尺寸和设备的适配，提供一致的用户体验，就像小红书在不同设备上都能完美展示一样。
性能优化
- 对图片进行压缩和优化，采用合适的图片格式（如 WebP），并实现图片懒加载，减少初始加载时间，提升小红书小程序的打开速度，尤其是在展示大量笔记图片时。
- 合理使用缓存机制，如本地存储（Storage），减少不必要的数据请求，提高小红书小程序的响应速度，例如缓存用户的个人信息和常用设置。
- 避免在页面渲染过程中进行大量的计算和操作，优化渲染性能，确保小红书小程序的流畅度，特别是在滚动浏览大量笔记时。
关键约定
- 对于常用的功能和逻辑，封装成工具函数或自定义组件，提高代码复用性，例如封装小红书的点赞、收藏等交互功能组件。
- 使用自定义状态管理方案进行数据管理，确保数据流动清晰，方便管理小红书小程序中的用户状态、笔记数据等。可以通过创建一个全局的数据对象，并封装相应的 get 和 set 方法，在不同页面和组件间共享和修改数据。
- 优化小程序的启动速度和响应速度，关注用户体验指标（如首屏加载时间、操作响应时间），打造出与小红书一样快速流畅的使用体验。
- 利用框架的自动导入功能，减少手动导入的工作量，提高开发效率。
判断登录
- 判断登录状态，如果未登录，则跳转到登录页面。
- 使用let current = Bmob.User.current() current.objectId 判断是否登录。
- 使用 wx.getStorageSync('openid') 获取用户手机号。
微信原生框架
- 遵循微信小程序的目录结构（如 pages/、components/、utils/ 等），便于开发和维护小红书小程序。
- 利用微信提供的 API 进行功能开发，如网络请求、数据存储、用户授权等，实现小红书小程序的各种业务功能，如用户登录、笔记发布等。
- 使用 wxml 和 wxss 进行界面和样式开发，结合 JavaScript 实现交互逻辑，构建出与小红书相似的界面和交互效果。
Bmob 后端云
- 熟悉 Bmob 后端云的基本概念和操作，如数据存储、文件存储、用户管理等，用于存储和管理小红书小程序的笔记数据、用户信息、图片文件等。
- 能够利用 Bmob 的 SDK 进行快速开发，实现与后端的数据交互，如查询笔记列表、上传笔记图片等。
- 掌握 Bmob 的安全机制，如数据权限设置、用户认证等，保障小红书小程序的数据安全，防止数据泄露和恶意攻击。
- 使用 Bmob 对象时，使用 wx.Bmob 对象，而不是 Bmob 对象。
- app.js 中初始化 Bmob 时，使用 Bmob.initialize("你的Application ID", "你的REST API Key")，其他地方不需要再初始化。
- query.equalTo("isLike", "==", 100); 是有三个参数的，第一个是字段名，第二个是运算符，第三个是值。
开发最佳实践
- 使用模块化开发，将不同功能拆分成独立的模块，便于管理和维护小红书小程序的各个功能模块，如笔记模块、用户模块等。
- 采用事件驱动的方式处理交互逻辑，提高代码的可扩展性和可维护性，例如处理小红书的评论、点赞等交互事件。
- 编写单元测试和集成测试，确保代码的正确性和稳定性，特别是在小红书小程序的功能更新和优化时。
- 遵循微信小程序的官方文档和开发规范，及时了解最新的政策和技术更新。同时，关注 Bmob 后端云的更新动态，合理运用新功能提升小红书小程序的质量。
- 深入分析小红书的业务逻辑和交互流程，在开发过程中注重细节，力求在功能和体验上与小红书高度相似。例如，精准实现小红书的搜索功能、推荐算法等。
图片
- 使用渐变色替代图片，减少图片的加载时间。
- 不新建任何图片资源，使用渐变色替代。
- 记录需要使用图片的地方，在最后统一添加。
- 缩略图使用现代渐变色替代。
1.7 提示词工程：构建专业AI对话能力
- 目标明确原则
- 上下文补充技术
- 结构化表达框架
# 角色
你是一位资深前端开发工程师
# 设计风格
优雅的极简主义美学与功能的完美平衡;
清新柔和的渐变配色与品牌色系浑然一体;
恰到好处的留白设计;
轻盈通透的沉漫式体验;
信息层级通过微妙的阴影过渡与模块化卡片布局清晰呈现;用户视线能自然聚焦核心功能;
精心打磨的圆角:
细腻的微交互;
舒适的视觉比例:
强调色:按APP类型选择;
# 技术规格
1、单个页面尺寸为375x812PX，带有描边，模拟手机边框
2、图标:引用在线矢量图标库内的图标(任何图标都不要带有背景色块、底板、外框)
3、图片:使用开源图片网站链接的形式引入
4、样式必须引入tailwindcss CDN来完成
5、不要显示状态栏以及时间、信号等信息
6、不要显示非移动端元素，如滚动条
7。所有文字只可以使用黑色或白色
# 任务:
这是一个【番茄钟】APP
模拟产品经理输出详细功能设计，信息架构设计，结合(设计风格)和(技术规格)输出一套uI设计方案。
生成一个u1.htm1文件，放入所有页面，横向排列。
现在生成前【2】个页面。
2. 微信小程序开发基础强化
2.1 获取秘钥
2.2 Bmob后端云配置
www.bmobapp.com/
注册配置
demo代码
// app.js
const Bmob = require('./utils/Bmob-2.5.30.min')
Bmob.initialize("xxx", "xxx");
App({
onLaunch() {
// 展示本地存储能力
const logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
console.log("hello");
// 调用Bmob一键登录，自动关联微信用户
Bmob.User.auth().then(res => {
console.log('一键登录成功', res)
// res中包含用户openid等信息
// 可以在这里进行用户信息的存储和处理
}).catch(err => {
console.log('登录失败', err)
})
// 删除一条数据记录
const query = Bmob.Query('test');
query.destroy('3cf9b8edc6').then(res => {
console.log('删除成功', res)
}).catch(err => {
console.log('删除失败', err)
})
// 登录
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
},
globalData: {
userInfo: null
}
})
云数据库
