妈妈说“这小程序真灵”：3天上线「广场舞曲库」小程序实录

上周五晚饭时，我妈边切黄瓜边念叨：“王姨她们跳舞老找不到新曲子，手机里存一堆MP3，点半天才出来一首……要是能像抖音那样一搜就播，多好。”

我放下筷子，掏出手机打开Cursor，对Claude Code说了一句：

> “生成一个微信小程序，首页是搜索框+热门曲库瀑布流，点击播放带进度条和收藏按钮，支持离线缓存前10首，UI清爽复古红金配色，适配中老年手指操作。”

23分钟后，扫码预览——曲库已可滚动，点开《最炫民族风》自动播放，收藏图标亮了，切到飞行模式再点播放，依然响！

这不是Demo，是真实上线的小程序（搜「舞曲快找」已通过审核）。今天分享零基础也能复刻的完整路径，连Git都不会按的阿姨级用户，照着做也能跑通。

---

✅ 第一步：准备环境（5分钟）

安装 [微信开发者工具](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html)（最新稳定版）

安装 [Cursor](https://cursor.sh/)（选「Sign in with GitHub」，绑定免费Claude 3.5 Sonnet权限）

微信公众平台注册「小程序账号」（邮箱注册→实名认证→获取AppID，全程免费）

> 💡小贴士：不用备案！个人类型小程序完全可发布，仅限体验版或正式版，无流量限制。

---

✅ 第二步：用Claude Code生成骨架（关键！）

在Cursor新建文件夹 dance-music-app → 新建 prompt.md，粘贴以下Prompt（已实测优化）：

你是一个资深微信小程序架构师。请生成一套完整、可直接运行的微信小程序代码，要求：
使用原生小程序语法（wxml/wxss/js/json），不依赖任何框架

功能：首页搜索框（模糊匹配曲名/歌手）、热门曲库瀑布流（12条）、点击播放（使用wx.getBackgroundAudioManager）、长按收藏（本地storage）、下拉刷新更新列表

UI：字体≥18px，按钮高度≥48rpx，红色主色(#d32f2f)，金色点缀(#ffca28)，所有交互区域留白充足

离线支持：首次加载后，自动缓存前10首音频URL及元数据到wx.setStorage

提供模拟数据：[{id:1,name:"最炫民族风",singer:"凤凰传奇",url:"https://xxx.mp3"},...]

输出结构：/pages/index/index.wxml, .wxss, .js, .json 四文件内容，无需解释

按下 Ctrl+K（Windows）或 Cmd+K（Mac），等30秒——Claude Code会输出4个完整文件内容。全选 → 右键「Save As」→ 分别保存为对应路径（注意目录层级）。

---

✅ 第三步：微调 + 替换音频资源（10分钟）

打开 index.js，找到 mockData 数组，把示例URL替换成你自己的音频（推荐用腾讯云COS免费桶上传MP3，获取外链；或先用[免费BGM网站](https://pixabay.com/music/)下载3首，拖进项目 /static/audio/ 目录）

修改 index.wxml 中 标签的 src 绑定为 {{currentSong.url}}（Claude已写好，仅需确认）

在 index.wxss 末尾加一句：

  .song-item { padding: 20rpx 30rpx; }
  

——让阿姨们戳得更稳

---

✅ 第四步：调试 & 真机测试（重点！）

微信开发者工具 → 顶部菜单「工具」→「构建npm」（勾选「使用npm模块」，虽未用npm但防报错）

点击「编译」→ 出现二维码 → 微信扫码 → 立即试用

测试三件事：

1. 搜索“江南Style”，是否出现结果？
2. 点击播放后，切后台再切回，音乐是否继续？
3. 关掉WiFi，重复步骤2，是否仍可播放缓存曲目？✅

若失败？90%是音频域名未配置：在「开发管理→开发设置→服务器域名」中，把你的COS域名或BGM网站域名填进 request合法域名 和 downloadFile合法域名。

---

✅ 第五步：提交审核（1分钟）

开发者工具右上角「上传」→ 版本号填 1.0.0 → 备注“广场舞曲库v1，纯前端，无后端”

公众平台 → 版本管理 → 提交审核 → 类目选「工具-生活工具」→ 描述写：“为中老年用户提供免安装、即搜即播的广场舞伴奏服务，所有音频经版权方授权使用”（我们用的是CC0协议免费音源，合规）

平均审核时长：24小时。我妈昨天刚在群里发了小程序码，今天已有27个舞蹈队群主动索要链接。

---

🌟为什么这个案例特别适合新手？

❌ 不需要API密钥（没调用任何外部接口）

❌ 不需要数据库（全部本地storage）

❌ 不需要部署服务器（微信云开发非必须）

✅ 全流程由自然语言驱动，改Prompt=改功能

✅ 界面适配中老年，反而规避了复杂动效和响应式陷阱

下次你想做「社区菜价播报」「老年大学课表」「医保报销指南」？复制本Prompt，替换关键词，再跑一遍——你不是在写代码，是在指挥AI搭积木。

> 文末彩蛋：我把本项目的Prompt模板、音频资源包、审核话术整理成PDF，关注「我是RD」公众号，回复【舞曲】自动获取。

结语

编程的终极形态，不是键盘敲出符号，而是把想法清晰翻译成AI能听懂的语言。我妈不会写JS，但她知道“要能搜、要大声、要关网也能放”——这就够了。人人都是程序员，从听懂需求开始。