微信小程序开发日记（2）—— 开发经历

历时4个多月，练手小程序「聚会报名」终于在本周一正式发布了，欢迎试用；
最新版微信可直接扫描下图的小程序码，如无法识别请直接搜索「聚会报名」。

由于技术限制（能力问题），设计效果和实际效果还是有不少差距；
由于时间限制（各种拖延），整个开发过程基本是以「2天打鱼、3周晒网」的节奏。
本文记录的为开发过程中的一些「大事件」

前端框架

原始设计图

由于我设计界面完全就是微信Style，最初是打算自己写CSS的。
但实际上手不久后，遇到了一个问题：
系统默认的CSS中，input里的文字和普通text在y坐标有很大的偏差，而且在模拟器、安卓、iOS上的偏移量都不同；
在搜寻解决方案的过程中，意外发现了WeUI

WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计
https://github.com/weui/weui-wxss

这款WeUI对我而言：

因此，果断直接采用了这套样式库，为之后的开发过程省了不少事，感谢微信团队。

后端服务

后端，从一开始的目标就是要找现成的服务，果然有很多可用的后端平台（如果找不到，真的可能就放弃开发了），在一番对比后、很快就决定了选择LeanCloud，因为当时（1月初）它的官方文档和小程序示例最易懂。

LeadCloud
https://leancloud.cn/docs/weapp.html

不过用LeadCloud做「增删改查」感觉好麻烦…比SQL语句难用多了，做完基础的报名流程后依然还是一知半解；
加上过完年开始工作了、天天加班，开放进度异常缓慢；
Github项目地址就不公布了，代码写得太烂，不敢见人……

踩坑

在开发过程中，就算是老司机也难免踩坑，更别提我们这种业余级别的菜鸟了。
其中最大的一个坑，是地图层级问题，直接导致了活动介绍界面重新设计（虽然改起来其实挺快的）。

「原始设计图」与「实际效果」的对比

在模拟器中调试时，地图的显示一切正常，但是到了真机中，「报名参加」按钮被地图给挡住了……
当时查了好久都没找出问题所在、也没搜到能解决问题的相关信息，这个bug也就一直搁置着。
直到3月份重新开始继续开发后续页面时，在官方的地图控件介绍下面看到了这段说明（在1月份并没有！），终于放弃了尝试、改了效果图。

Bug & Tip
tip: map 组件是由客户端创建的原生组件，它的层级是最高的。
https://mp.weixin.qq.com/debug/wxadoc/dev/component/map.html#map

第一版

最基础的报名流程，其实第1周就做好了（虽然后面重写了），后来由于过年停滞了好久。2月份过完年之后，为了尽早上线、体验后台的数据分析功能，便简单包装了一下、发布了非常简陋的第一版。靠着伪装成「内部工具」通过了审核，当时的页面长这样：

每天还真有不少新用户会搜到这个啥都干不了的小程序，真对不起他们…

正式发布

上周末终于完成了MVP版本的开发，提交了审核，整套流程至少能跑通了。
微信团队的审核速度还挺快，周一上午就完成了审核。
由于还有好多功能没完成、以及数不清细节没有优化，上线后这几天没敢做过任何宣传、完全靠用户自发的去搜索、互相传播，每天居然也能有百来个新用户。
虽然人不多，但是每天刷刷微信的后台统计、以及数据库里的记录，还是能发现不少有意思的地方。

这个小程序的功能复杂度、系统规模，比起之前工作中设计的游戏系统可简单多了，
在公司里，对于这么一个中等量级的系统，我留给开发（1前端+1后端）的时间最多也就1周，
而到了自己这里，居然花了4个月，千万不能让他们知道……

---

• 微信小程序开发日记（1）—— 起点
• 微信小程序开发日记（2）—— 开发经历
• 微信小程序开发日记（3）—— 数据