微信小程序開發(fā)日記(2)—— 開發(fā)經(jīng)歷

歷時(shí)4個(gè)多月,練手小程序「聚會(huì)報(bào)名」終于在本周一正式發(fā)布了,歡迎試用;
最新版微信可直接掃描下圖的小程序碼,如無法識(shí)別請(qǐng)直接搜索「聚會(huì)報(bào)名」。


由于技術(shù)限制(能力問題),設(shè)計(jì)效果和實(shí)際效果還是有不少差距;
由于時(shí)間限制(各種拖延),整個(gè)開發(fā)過程基本是以「2天打魚、3周曬網(wǎng)」的節(jié)奏。
本文記錄的為開發(fā)過程中的一些「大事件」

前端框架

原始設(shè)計(jì)圖

由于我設(shè)計(jì)界面完全就是微信Style,最初是打算自己寫CSS的。
但實(shí)際上手不久后,遇到了一個(gè)問題:
系統(tǒng)默認(rèn)的CSS中,input里的文字和普通text在y坐標(biāo)有很大的偏差,而且在模擬器、安卓、iOS上的偏移量都不同;
在搜尋解決方案的過程中,意外發(fā)現(xiàn)了WeUI

WeUI 是一套同微信原生視覺體驗(yàn)一致的基礎(chǔ)樣式庫(kù),由微信官方設(shè)計(jì)團(tuán)隊(duì)為微信內(nèi)網(wǎng)頁(yè)和微信小程序量身設(shè)計(jì)
https://github.com/weui/weui-wxss

這款WeUI對(duì)我而言:



因此,果斷直接采用了這套樣式庫(kù),為之后的開發(fā)過程省了不少事,感謝微信團(tuán)隊(duì)。

后端服務(wù)

后端,從一開始的目標(biāo)就是要找現(xiàn)成的服務(wù),果然有很多可用的后端平臺(tái)(如果找不到,真的可能就放棄開發(fā)了),在一番對(duì)比后、很快就決定了選擇LeanCloud,因?yàn)楫?dāng)時(shí)(1月初)它的官方文檔和小程序示例最易懂。

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

不過用LeadCloud做「增刪改查」感覺好麻煩…比SQL語(yǔ)句難用多了,做完基礎(chǔ)的報(bào)名流程后依然還是一知半解;
加上過完年開始工作了、天天加班,開放進(jìn)度異常緩慢;
Github項(xiàng)目地址就不公布了,代碼寫得太爛,不敢見人……

踩坑

在開發(fā)過程中,就算是老司機(jī)也難免踩坑,更別提我們這種業(yè)余級(jí)別的菜鳥了。
其中最大的一個(gè)坑,是地圖層級(jí)問題,直接導(dǎo)致了活動(dòng)介紹界面重新設(shè)計(jì)(雖然改起來其實(shí)挺快的)。


「原始設(shè)計(jì)圖」與「實(shí)際效果」的對(duì)比

在模擬器中調(diào)試時(shí),地圖的顯示一切正常,但是到了真機(jī)中,「報(bào)名參加」按鈕被地圖給擋住了……
當(dāng)時(shí)查了好久都沒找出問題所在、也沒搜到能解決問題的相關(guān)信息,這個(gè)bug也就一直擱置著。
直到3月份重新開始繼續(xù)開發(fā)后續(xù)頁(yè)面時(shí),在官方的地圖控件介紹下面看到了這段說明(在1月份并沒有!),終于放棄了嘗試、改了效果圖。

Bug & Tip
tip: map 組件是由客戶端創(chuàng)建的原生組件,它的層級(jí)是最高的。
https://mp.weixin.qq.com/debug/wxadoc/dev/component/map.html#map

第一版

最基礎(chǔ)的報(bào)名流程,其實(shí)第1周就做好了(雖然后面重寫了),后來由于過年停滯了好久。2月份過完年之后,為了盡早上線、體驗(yàn)后臺(tái)的數(shù)據(jù)分析功能,便簡(jiǎn)單包裝了一下、發(fā)布了非常簡(jiǎn)陋的第一版。靠著偽裝成「內(nèi)部工具」通過了審核,當(dāng)時(shí)的頁(yè)面長(zhǎng)這樣:



每天還真有不少新用戶會(huì)搜到這個(gè)啥都干不了的小程序,真對(duì)不起他們…


正式發(fā)布

上周末終于完成了MVP版本的開發(fā),提交了審核,整套流程至少能跑通了。
微信團(tuán)隊(duì)的審核速度還挺快,周一上午就完成了審核。
由于還有好多功能沒完成、以及數(shù)不清細(xì)節(jié)沒有優(yōu)化,上線后這幾天沒敢做過任何宣傳、完全靠用戶自發(fā)的去搜索、互相傳播,每天居然也能有百來個(gè)新用戶。
雖然人不多,但是每天刷刷微信的后臺(tái)統(tǒng)計(jì)、以及數(shù)據(jù)庫(kù)里的記錄,還是能發(fā)現(xiàn)不少有意思的地方。

這個(gè)小程序的功能復(fù)雜度、系統(tǒng)規(guī)模,比起之前工作中設(shè)計(jì)的游戲系統(tǒng)可簡(jiǎn)單多了,
在公司里,對(duì)于這么一個(gè)中等量級(jí)的系統(tǒng),我留給開發(fā)(1前端+1后端)的時(shí)間最多也就1周,
而到了自己這里,居然花了4個(gè)月,千萬不能讓他們知道……


最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,136評(píng)論 25 708
  • 許我十里桃花 許我嫁衣紅霞 許我四海為家 許我相思放下 許我淡飯粗茶 許我青絲白發(fā) 許我當(dāng)歌縱馬 許我浪跡天涯。 ...
    丿之恒閱讀 205評(píng)論 0 0
  • 鳳九抱著盒子,走出了狐貍洞,不是去了別處,而是去了當(dāng)年白淺盛放墨淵仙身的炎華洞。這炎華洞,常年氣溫較低,仙氣繚繞,...
    轉(zhuǎn)角花開閱讀 3,932評(píng)論 1 45
  • 我希望全國(guó)各省都有幾個(gè)我認(rèn)識(shí)的人,并不是想圖什么利益關(guān)系只是希望我能對(duì)他所在的那個(gè)省份地區(qū)都能了解一點(diǎn),以后再遇到...
    羅小扇閱讀 240評(píng)論 0 0
  • 1.架構(gòu)如圖9-5所示,Spark運(yùn)行架構(gòu)包括集群資源管理器(Cluster Manager)、運(yùn)行作業(yè)任務(wù)的工作...
    d33911380280閱讀 1,193評(píng)論 0 2

友情鏈接更多精彩內(nèi)容