大家好，我是大华！
前几天我用 AI 做了一个戒烟的微信小程序，想验证一下，一个普通的开发，用免费的 AI 工具，多久能做出一个可上线的产品。
核心功能非常简单，整体开发调试也就花了2个小时的样子，倒是小程序的注册、备案和代码审核，前前后后花了一周。
整个项目 没有后端，数据全部存在本地；用到的 AI 工具，也全部是免费的。
下面把整个过程完整分享一下。
用到的 AI 工具
就两个：DeepSeek、v0.app。
一个负责想清楚做什么，一个负责把东西直接写出来。
功能设计
一开始我其实只有一个很模糊的想法：做一个戒烟小程序。
但说实话，现在这类小程序已经很多了，我这个也谈不上什么亮点。
于是我直接把自己的想法丢给了 DeepSeek，让它同时站在前端工程师 + 产品设计师的角度，帮我把功能拆清楚。
我把我的想法告诉 DeepSeek，让它来帮我做功能设计和代码生成提示词，最终整理出来的提示词如下：
你是一名资深前端工程师 + 产品设计师，请帮我生成一个完整的【戒烟记录 Web App】。
要求：
- 纯前端实现（HTML + CSS + JavaScript），无需框架
- 单页面应用（SPA 风格），点击底部导航切换视图
- 移动端优先布局（Mobile First），响应式设计，兼容手机浏览器
- 所有数据存储在 localStorage
- 项目文件结构清晰、可长期维护
- 页面操作成本低于 3 秒
- 产品风格极简、现代、正反馈导向，不说教、不制造焦虑
页面结构及功能：
1. 首页（Dashboard）
- 显示今日已抽 / 今日目标
- 距离上一次抽烟时间
- 今日节省金额
- 简短正反馈文案
- 按钮：「+ 抽了一根」和「我现在很想抽 😣」
- 点击记录当前时间，刷新数据
2. 记录页（TimeLine）
- 按时间倒序展示抽烟记录
- 每条记录显示时间
- 支持可选原因：压力、社交、无聊、情绪
- 支持删除记录（需二次确认）
- 数据来自 localStorage
3. 统计页（Stats）
- 展示最近 7 天抽烟数量折线图
- 展示抽烟原因分布饼图
- 显示连续未超标天数、最长坚持记录
- 所有统计实时计算
4. 应对页（Coping）
- 提供 3 个工具模块：
1. 延迟 3 分钟倒计时
2. 60 秒呼吸引导（文字）
3. 随机分散注意力小任务
- 完成后显示轻量正反馈
5. 设置页（Settings）
- 每日抽烟目标
- 戒烟模式（立刻戒断 / 逐步减少）
- 单根香烟价格
- 固定每日提醒（前端模拟）
- 数据修改后立即生效
整体要求：
- 底部固定 Tab Bar 导航（首页、记录、统计、应对、设置）
- 顶部标题栏显示当前页面名称
- 响应式布局，支持触屏操作
- localStorage 操作封装成统一 dataService（可后续替换为后端 API）
- 代码整洁、模块化，易于维护
- 页面风格统一，简洁现代
- 所有按钮、表单、交互逻辑、数据统计逻辑完整实现
- 可以直接在浏览器打开运行，无需服务器
请生成：
- 完整 HTML、CSS、JS 代码
- 注释清晰，标明各模块作用
- localStorage 数据结构说明
- 页面切换逻辑说明
- 数据统计逻辑说明
为了方便调试，我刻意让它先生成 Web 版本，而不是一上来就写小程序。
这一步，后面省了我不少事。
用 v0 把产品直接写出来
接下来我把这份提示词丢给了 v0.app：
v0 默认会生成 React 项目，而且可以直接把完整代码拉下来运行。
在 Web 版本确认整体没什么大问题之后，我再让它把现有功能改写成微信小程序版本，如下：
小程序代码需要手动处理的地方
小程序代码拉下来之后，直接用微信开发者工具打开，这时候代码是会有一点问题的。
几乎每个页面的 JS 文件里，都会有一些完全没用的声明，类似下面这种：
这种看到直接删掉就行，不影响任何逻辑。再稍微调整一下 CSS 样式，基本就没什么大问题了。
因为整个项目没有后端，也不涉及复杂接口，第一个版本就这样跑起来了。
实际效果
下面是几个页面的实际效果图：
关于注册、备案和发布
个人小程序认证其实很便宜，30 块钱就可以。但很多功能也会受到限制，比如支付，获取手机号等都没办法调用。
如果是企业小程序，需要 300 块认证费，要营业执照。支付能力还需要额外去注册微信支付商户。
注册、备案、发布的流程就不展开说了，只要资料齐全，基本按提示一步步走就行。
小程序已经上线了，大家也可以体验一下：
如果你也在用 AI 做项目，或者对这个戒烟小程序本身有想法，欢迎随便聊聊。
