常有开小店的老板问我们:家里有人学过一点前端,想自己做个能看菜单、能留电话的小程序,从哪儿下手?小程序开发的门槛确实不高,但新手最常见的情况是:代码写得差不多了,卡在服务器域名、备案或者提审上,一拖就是好几周。
下面就按小程序开发真正动手的顺序走一遍。以微信小程序为例,抖音、支付宝的思路大体相同,具体入口和规则都以平台最新说明为准。
第一步:注册账号,拿到 AppID
去微信公众平台注册一个小程序账号,选主体类型。想以后接支付、做商城的,建议直接用企业主体,个人主体能做的类目有限,后期再迁移挺麻烦。
注册完,在后台“开发管理”里能看到 AppID,这是小程序的身份证号,后面开发者工具、服务器配置都要用到。顺手把类目、名称、头像填好,名称不太好改,别随便起。
只想练手的话,可以先用测试号,不用等认证,但测试号不能发布。
第二步:装开发者工具,建第一个项目
从官方下载微信开发者工具,扫码登录后新建项目,填入 AppID,选一个基础模板。几秒钟后,左边是模拟器,中间是代码,右边是调试器,界面跟写网页的编辑器差不多,小程序开发的日常基本都在这里完成。
新手常纠结用原生还是跨端框架。我们的建议是:第一次做小程序开发,先用原生,把页面、生命周期、接口调用这些概念摸清楚。框架能省事,但出了问题你分不清是框架的锅还是自己的。
看懂小程序开发的目录结构
模板生成的文件不多,但每个都有讲究。
根目录的三个全局文件: app.js 写全局逻辑,比如启动时检查登录;app.json 是全局配置,所有页面路径要在 pages 里登记,底部导航栏也在这里配;app.wxss 是全局样式。
pages 目录下的页面: 每个页面一般是四个同名文件,.wxml 写结构,.wxss 写样式,.js 写数据和事件,.json 写这个页面单独的配置。
新建页面最快的办法是直接在 app.json 的 pages 数组里加一行路径,保存后工具会自动生成这四个文件。新手常犯的错是手动建了文件,却忘了登记路径,结果跳转时报“页面不存在”。
页面和接口:让数据动起来
小程序开发里页面是“数据驱动”的。你在 js 里用 setData 改数据,页面会跟着刷新,不需要像写传统网页那样手动去改元素。
拿门店菜单举例,大致是这几步:
- 在 wxml 里用列表循环渲染商品名称、图片和说明;
- 在 js 的 onLoad 里调用 wx.request,向你自己的后台要菜单数据;
- 拿到结果后 setData 填进页面;
- 给“联系店家”按钮绑一个点击事件,调用拨号接口。
有一点要提醒:setData 别一次塞太多数据,也别在滚动事件里频繁调用,页面会明显卡顿。列表很长的话,分页加载更稳。
服务器域名和备案:新手最容易卡的一关
在开发者工具里勾选“不校验合法域名”,接口能跑通,于是很多人以为没问题了。等到真机预览或者上线,请求全部失败。
原因是小程序正式环境只允许访问在后台登记过的服务器域名,而且必须是 HTTPS,证书要有效。域名一般还需要完成 ICP 备案,近几年小程序本身也有备案要求。这两件事都有审核周期,建议写代码的同时就把域名、证书和备案一起办,别等代码写完再开始。
暂时没有服务器的,可以先用平台的云开发把功能跑起来,后面再迁移。
调试:模拟器之外一定要真机
模拟器好用,但它不等于手机。我们见过不少问题只在真机上出现:安卓和苹果的日期格式解析不一样,某些机型图片显示变形,定位授权弹窗的表现不同。
开发者工具里有“预览”和“真机调试”。预览是扫码在手机上看效果,真机调试能在电脑上看到手机端的日志和网络请求,排错效率高很多。小程序开发阶段找两三台不同品牌、不同系统的手机各测一轮,比在模拟器里点一百遍有用。
提审和发布:把小程序开发的最后一步走完
代码在工具里点“上传”,填版本号和备注,然后去后台把这个版本设为体验版,让同事先用几天。确认没问题,再提交审核。
审核看的重点一般是:功能和所选类目是否一致,页面有没有空白或者“敬请期待”,需要登录的功能有没有给审核人员提供测试账号,涉及用户信息的地方有没有隐私说明。新手被驳回,十有八九是这几条。
审核通过后,在后台点发布,用户就能搜到了。以后每次改版也是“上传 → 体验 → 提审 → 发布”这个循环。
结论
小程序开发的上手路线其实很清楚:注册账号拿 AppID,装工具建项目,看懂目录结构,写页面调接口,同步办好域名、证书和备案,真机调试,最后提审发布。真正耽误时间的往往不是代码,而是域名备案和审核这些“非技术”环节。如果你只是想把想法快速变成可用的小程序,或者自己做到一半卡住了,蔚岚科技可以帮你看看问题出在哪,也可以接手小程序开发,电话 18720919319。
常见问题
不会编程,能学小程序开发吗?
能入门,但要有心理准备。会一点 HTML、CSS 和 JavaScript 会快很多;完全零基础的话,建议先花时间学这三样,再看官方文档动手。
个人能自己开发小程序并上线吗?
可以注册个人主体并上线,但个人能选的类目有限,支付、电商类功能一般需要企业主体,开工前先确认你的功能在不在个人可选范围内。
开发小程序一定要自己买服务器吗?
不一定。纯展示类页面、或者用平台云开发的,可以先不买服务器。要对接自己的会员、订单系统,一般还是需要自有服务器和已备案的域名。
为什么模拟器正常,手机上打不开接口?
最常见的是服务器域名没在后台登记、不是 HTTPS 或证书有问题。开发者工具里那个“不校验合法域名”的选项只在本地生效,真机和线上不认。
第一次提审一般会被驳回吗?
不一定会,但新手被驳回很常见,多半是类目不符、页面不完整或者没给测试账号。提审前对着平台的审核规范自查一遍,能少来回几次。