今天依旧是分享干货的一天喜欢的童鞋们一定要多关注收藏哦这样博主会有更多的动力去分享更多内容当然分享的内容必须是尽我最大的能力去做希望能有效帮助到大家包括我自己这一直是我做公众号的初衷今天的主题是VibeCoding实战系列—— 从 0 到 1 做一款有用的小程序。这个主题很多小伙伴们可能都已经烂熟于胸了有的大V可能通过一些高流量小程序实现财富自由了当然更多的像博主一样的开发者都做过N个小程序了。小程序发展至今基本没有什么领域或模块没有被做过就像当年的淘宝一样属于小程序流量爆款的时代早就过去。但是很多企业包括个人在开发产品的时候仍然会想到小程序这个载体。为什么没有别的就一个原因——背靠微信所以流量基数不用担心。同时AI 时代到来这是一个全民编程的时代古法编程时代的技术壁垒已经逐渐被打破随手搓两个小程序几乎成为了每个非开发人员喜闻乐见的活动同时用uniapp搓小程序还有一个天然的红利那就是制作成出海APP。综上——小程序开发仍然是一个热门领域和话题。阅读过之前的文章可以发现博主最近疯狂搞小程序包括制作了一些SKILL来提效开发流程。当然让我头疼的除了开发规范和流程就是开发什么很多小伙伴跟我一样第一目标是流量那么什么东西有流量这个问题我想破了脑袋都没有想到结果。每个人所在的位置不一样眼界不一样需求不一样因此想做的东西自然不一样我站在我自身需求和老登开发的角度上始终无法找到一个平衡点再加上个人小程序限制太多基本上都只能围绕一些小工具小分享之类的打转。在经历了各种各样的头脑风暴之后博主终于找到了一个方向那就是做一款——笔记分享类的小程序它叫「狐獴笔记」接下来分享详细的开发流程与小程序细节。一、开发前自我询问1. 技术栈与开发工具不多说uni-app 3 Vue 3 TypeScript写一套代码微信小程序、H5、App 三端都能跑。Pinia状态管理比 Vuex 轻适合小程序。HBuilderX/ VS CodeHBuilderX 是 uni-app 官方 IDE一键运行到微信开发者工具VS Code 写代码更顺手小白或要开发APP的建议前者熟练一点的建议VScode。微信开发者工具必须装用来预览、调试、上传代码。后端FastAPI MongoDB MotorPython 写的部署在云服务器。AI 模型Claude / DeepSeek 混用Claude 写业务逻辑DeepSeek 做内容安全校验。这里有两个SKILL分别对应着前端和后端用于生成基础骨架上面介绍的是当前这款小程序选择的架构。后端骨架SKILL待生成关注git地址即可。2. 内容选题怎么定建议先头脑风暴抓下数据进行分析下如果实在没有符合自己心意的先做一个自己给自己使用的小程序。所以「狐獴笔记」的定位就是轻、快、属于自己。你可以把它理解成一个“带分类和搜索的增强版备忘录”适合记灵感、记账、记代码片段、记一切乱七八糟但以后可能要找的东西。灵感来了随手记的人觉得备忘录不够用的轻度笔记用户想有一个“自己的知识库”但不想折腾 Notion 的人想研究 uni-app 小程序开发、找个真实项目参考的初学者作为一个提示词存储箱和大家共享优秀的AI 开发提示词3. 如何创建小程序很多小白以为代码写完就完事了其实小程序上线前还有一堆“行政流程”。我列一下我实际经历的项目说明建议小程序注册去微信公众平台注册小程序账号个人/企业主体都可以。企业主体功能权限更多。个人先做 MVP跑通再迁移企业主体类目申请笔记工具一般选「工具-效率」或「教育-学习」。选错会被审核打回。不确定就参考同类型小程序的类目备案2023 年 10 月起微信小程序必须完成 ICP 备案才能上线。需要域名和服务器信息。用国内云服务器域名实名认证要和主体一致logo小程序头像建议 144×144 像素圆角会被微信自动裁切。简洁、高对比度小尺寸也能看清名称我选了「狐獴笔记」好记、有辨识度。名称一年内可修改 2 次。提前在小程序搜索里查重简介一句话介绍小程序控制在 20 字以内影响搜索和分享展示一定要写好关键词不要罗里吧嗦写废话。突出核心卖点比如“轻量化笔记支持 Markdown”域名白名单小程序只能访问配置在白名单里的 HTTPS 域名。后端接口、图片 CDN、外部链接都要提前配置这些流程走下来快则一周慢则一个月。所以别等代码写完了再准备越早开始越好。4.AI 怎么搞Claude Code国产大模型足够,当然Qoder/Cursor/TRAE/CodeBuddy都没问题自己熟悉啥就用啥个人习惯于Claude Code cliswitch推荐如下SKILL:二、需求清单1. 写笔记三种模式打开详情页你就能新建或编辑一条笔记。它支持三种内容模式模式适合场景说明纯文本随手记、灵感、待办最简单打开即写Markdown技术文档、结构化内容支持标题、加粗、代码块、引用、列表、分隔线富文本需要排版的内容可视化编辑所见即所得重点说一下 Markdown 和富文本。如果你写代码、写技术方案、写读书笔记Markdown 是效率最高的格式。它支持标准语法还能一键预览最后导出的.md文件可以直接丢给任何 AI 工具继续处理。如果你只是想快速排版一段文字、插入加粗和颜色富文本模式更直观不用记语法像写公众号后台一样拖拽编辑。Markdown 模式下还配了一个工具栏点一下就能插入格式不用背语法。2. 笔记分类丰富的分类让日常工作高效无压力首页是一排分类卡片进去就是该分类下的笔记列表。默认有 5 个分类写作、编程、绘图、办公、学习。你可以自己新增、编辑、删除分类还能给分类选图标。删分类的时候里面的笔记会自动移到“未分类”不会丢。分类管理的入口在「我的」页面里。这些分类不是摆设它们是为了让日常工作更轻松办公会议纪要、周报模板、项目排期随时调取。编程代码片段、Bug 记录、API 地址不再散落各处。学习读书笔记、课程重点、错题本复习时一搜就有。写作灵感金句、文章大纲、素材库写作时不再卡壳。绘图配色方案、设计参考、尺寸规范设计师的随身资料库。你甚至可以为每个客户、每个项目建一个分类工作再杂也能井井有条。3. 标签 搜索每条笔记最多可以加 10 个标签。列表页顶部有搜索框支持按内容和标签搜索结果会高亮关键词。搜索历史会本地保存最近 10 条常用标签也会自动展示在页面上。你再也不用担心“我那天到底把那句话记哪儿了”。4. 置顶 收藏重要的东西放最上面置顶自己写的笔记可以置顶永远在列表最上面。收藏可以收藏自己的笔记也可以收藏「笔记大厅」里别人公开的笔记。收藏的内容统一在「我的收藏」页面查看。5. 笔记链接远程查看 喂给 AI工作玩耍两不误在微信里你可以把某条笔记卡片分享给朋友。对方点击后会直接跳转到这条笔记的详情页。这是因为分享链接里带了笔记 ID小程序启动时会自动解析并打开对应内容。相当于给每条笔记生成了一个“可访问地址”。但这还不是笔记链接最香的地方。最香的场景是远程查看 喂给 AI。想象一下你早上挤地铁灵感突然来了就在「狐獴笔记」里写了一段产品想法。到公司后你打开电脑用浏览器打开这条笔记的远程链接直接把内容复制到 Claude、ChatGPT、DeepSeek 里让它帮你扩展成一份完整方案。或者在公交车上记了一篇会议纪要回家后用电脑打开链接丢给 AI 总结重点、生成待办。手机写、电脑读、AI 继续写这才是笔记链接的真正用法。6. 本地私密笔记密码、提示词放这就对了当然不是所有笔记都适合上云。「狐獴笔记」支持本地存储模式笔记的标题、分类等元数据会同步到后端但正文只存在你的手机本地不上传服务器。这个模式特别适合放这些东西各种平台的账号密码我是真的记不住AI 提示词 Prompt精心调了很久不想被别人看见银行卡号、身份证号照片老板的八卦划掉本地模式 锁屏密码基本就是你的数字保险箱。7. 笔记下载 / 导出一键把所有笔记带走在「我的」页面点击「导出全部」可以把所有笔记导出成一个 Markdown 文件。不同平台行为略有不同微信小程序会写入小程序本地文件并尝试用微信的openDocument打开如果打不开会自动把内容复制到剪贴板。H5 / 浏览器直接触发浏览器下载.md文件。其他平台回退到剪贴板。这就避免了“我写了 100 条笔记想带走却导不出来”的尴尬。8. 笔记分享不只是发微信除了微信好友和朋友圈分享每条笔记还支持复制内容到剪贴板列表页、大厅、详情页都能一键复制。设为公开公开后这条笔记会进入「笔记大厅」别人能看到、能收藏。公开笔记在发布前会经过 AI 内容安全校验防止违规内容流出去。9. 笔记大厅看看别人在记什么这是一个公开笔记广场。你可以浏览别人公开的笔记按分类筛选、搜索看到喜欢的就收藏到自己的库里。它解决了一个很真实的问题有时候你不知道自己该记什么看看别人记的灵感就来了。10. 回收站手滑删除还能救回来删除的笔记不会立刻消失而是进入回收站保留 30 天。期间你可以恢复也可以彻底删除。30 天后系统会自动清理。三、总结一下在VibeCoding时代不要想太多。古话说的好无心插柳柳成荫有心栽花花不开。有可能别人做的小程序UI 很烂页面没几个功能更是简单到发指但就是日活上千而我们自身辛辛苦苦做了几百个功能每天打开的人数不到五个。为什么不去多想道理很简单——干就完了也许你脑海里有很好的点子有别人根本想不到的点子古法时代有技术壁垒你需要找人做需要费老劲沟通有时候沟通还不畅而VibeCoding时代那还等啥子开搓吧当然这并不意味着所有非开发人员都能随便搓出大型复杂【数据库拓展、提高并发能力、对接中间件、自行部署迭代以及维护网络安全、对接第三方API等等等】的项目来的仍然需要不断学习只不过学习的不是各类基础编程知识而是工程化AI的相关知识。也许你还缺一个这样富有AI开发经验以及丰富的产品和设计能力的分享者和学习者没错我就是这样的博主。喜欢的话别忘了关注点赞加收藏呀VibeCoding系列、SKILL系列以及各种各样的AI 工程化系列都会持续更新跟进大家都在VibeCoding啥呢有啥问题或者有木有啥好用的SKILL或提示词啥的用的啥模型是不是多Agent一起搞一个产品一个开发一个测试一起交流下吧
