開發到上線僅 16 天,海外黨研發微信小程序全攻略
我開發的小程序“微群日歷”1月8日正式開始開發,1月20日提交審核,1月22日被拒,再提,1月24日通過審核正式上線。上線三天,并沒有什么太多推廣。目前快500位用戶登陸,其中50位左右身邊朋友,其余多半是因為我掛在“知曉程序”上來的,比我預期的好不少。
因為我在海外,很多坑都是第一次踩,好記性不如爛筆頭,我把經歷寫下來,也希望能幫助到其他在海外想要做小程序的小伙伴。
如果想進行試用,請在微信搜索”微群日歷“去得到它。
為什么做該款小程序?
這里我先講個小故事,很清晰的記得2年前遇到過一個六七十歲白發蒼蒼的老美程序員,他雖然退休了,他說今天是他的生日,收到了一個很特別的禮物 Punch Card。
看起來是不是像答題卡?這就是他們那個年代編程用的,拿著一厚沓這個紙給電腦讀,運行程序。老大爺拿著問我說你知道上面寫的啥么?我心想這是什么鬼,當然臉上卻堆出敬仰的笑容,他得意地說:”這上面寫著,Happy Birthday,我一眼就認出來了,哼哼”。
聽到這話,我心里默默罵了一句。不是我覺得自己是新青年而看輕老大爺,而是我覺得很悲哀,因為20年后多半俺也會這樣,一種被時代淘汰的既視感撲面而來。
我們每天學習很多東西,但多無法沉淀。
多年以后,當偉哥和孫子在葡萄架下乘涼的時候,他一定會想起無數個吭哧吭哧搬磚的那個遙遠的冬季的夜晚。
——《百年磚工》
技術的潮流跟時尚異曲同工,一波一波的,不斷在改變。然而又有些不一樣,復古的時尚偶爾會還魂,但古老的技術基本會死硬在了沙灘上。
上面這張圖是上次請資深美國表演藝術家,微軟Distinguished Engineer,James Whittaker給放的。他說,你只要讓開發者爽了,那你也就能爽了。
那么現在來說回小程序。微信小程序就讓開發者很爽,完全原生的體驗,開發效率提高起碼10倍。網上已經很多文章了,我附和幾句:
- 開發快。 小程序開放內測沒幾天,就有破解的開發工具在Github上放出來。一堆人開源自己做的小程序。一個可能你要雇3個人開發半年的東西,在小程序上2禮拜就出來了。快!
- 加載快。 微信設了上限1MB,那是什么概念?Google主頁打開,啥也不做,就是527KB的下載。我的小程序還一共不到300KB呢,比Google主頁還小,所以微信打開一個小程序,就跟打開一次Google主頁一樣簡單,一樣快。而且事實證明,1MB已經能做很多事情了!
- 體驗好。 市面上很多人拿著H5的頁面冒充小程序,比如最近Trump的那個。很多人不明白,其實小程序UI就是原生App,不是H5,更不是拿H5來做得像原生的。H5和Native App之爭由來已久,諸多試圖把H5做得像原生應用的體驗其實都差,比如Cordova,Ionic。做來玩兒的或者超簡單的或者給企業的可以湊合吧,給Mass Consumer的,總是這邊那邊不爽,卡頓。后來非死book出了React和React Native帶來一線曙光,跟小程序原理其實也很類似。React Native也有些跟小程序類似理念的startup出來,只是東家非死book又有技術又有流量卻不去做這個,這里就不得不佩服國人的速度。試過小程序的應該知道,體驗是相當流暢的。
有這三點,就夠了。其實再過兩年以后,絕大部分人都不會再開發底層App,基本都會往類似React Native走,因為體驗上其實并沒有這么多差別。再過五年,那時候AI的Converstaion based Application應該會占主導地位,很多任務你已經不需要手機了(一定需要視覺的比如游戲娛樂可能除外),你更不需要App,就像現在的Alexa Skills。比如你看看現在誰還在寫MFC?估計很多人都沒聽過……
那么有人說微信有限制,封閉。的確是有很多限制,比如游戲不能做,否則做個麻將棋牌類,往群里一扔,分分鐘秒殺皮皮麻將啊。代碼不能超1M,不能外鏈跳轉,不能分享朋友圈,小程序入口只有群分享,搜索和攝像頭掃描二維碼(注意不是圖片識別二維碼)。說實話限制不是一般的大啊。但是呢,大家退一步看:
- 這些是人為加的限制。 微信現在的有著巨大優勢敢制定規則,要是他發現小程序沒有達到想要的效果,會不會某些地方能稍微開放一些?說個簡單的吧,比如帶參數二維碼最開始1萬個,正式發布前上調10萬個。微信也是在摸著石頭過河。并且在這個過程中不斷調整游戲的平衡。
- 這是給小創業者的機會。 你沒有那么快被吃掉。因為大魚們也沒有摸到該怎么玩兒。不少按自己公司主營業務,原始的照搬過來,還有羅胖這種利益沖突太大直接不玩兒了的。大公司玩兒不動了,各位Startup還不趕緊八仙過海各顯神通。
微信玩兒的是陽謀,擺明了就是想補他欠缺的地方,比如群協作,比如線下+線上。不想讓你來微信打發時間(玩游戲)。這讓我想起了最近亞馬遜停掉免費Review的Program。以前亞馬遜正兒八經的允許有給樣品然后Review的項目,后來據說是中國賣家太多,國人出海賣貨也不知道怎么辦,簡簡單單就是花錢沖Review。亞馬遜停掉這個Program,就是想讓大家回歸到做好產品。
張小龍你看得出他是有初心的人,希望大家去做Make the World a Better Place的事情。而不是簡簡單單抓住用戶注意力不放。
如果我所做的,能讓世界變得美好一點點,那我也就滿足了。
我想做,那該怎么開始?
學習小程序,已經有不少教程了,選幾個放出來,我就不贅述了。不過網上資料有些多,看著就亂了,有幾個我特別比較推薦的拿出來講講。
微信官方教程:
- 官方教程 還是很不錯的,很多不明白的東西是在這上面看的。入門教程可以多看幾次整明白了,API和組件等到用的時候再看吧。首頁上的小程序示例源代碼可以下載下來,很不錯的參考。
- WeUI 樣式 ,微信設計團隊自己推出的設計樣式,非常有用,很多時候不知道該怎么設計,或者自己布局很丑,我都會先看這上面的。
- 快速開發樣板 ,很輕量級的樣板,幫你快速上手。
關于Framework:碼工們都喜歡重用輪子,有些人一上來找Framework,現在也有好幾個出來了,我強烈建議是先不要用。一來還都不算成熟,用開源的最怕就是選錯Dependency。二來1MB的上限一不注意很容易就到了,交給不可控的framework還是不放心。有人還支持了用NPM的庫,那就更要小心了,一個平時網頁常用的lodash都要500k,NPM庫很容易一下子超標。剛開始的時候,還是先手寫吧,熟悉一下,進階之后再自行決定。
上面那幾點差不多可以start了,我基本上就是用這些。還想多學習的,這個上面有不少資料:
https://github.com/justjavac/awesome-wechat-weapp 不過警告一下,很容易看花眼,看多了反而自己就不好做決定,Choice is pain。
在海外做有什么不同?
首先一個問題是為什么要在海外做小程序?其實沒啥別的,就是想做個自己和周圍朋友能用的。出了國的才知道,老美的各種東西,比起國內的遍地開花差的便捷得太遠了!
比如我做的這個微群日歷小程序,一開始就是想解決每次potluck時,大家約時間和匯報到底帶什么菜的事情,省的每次去翻記錄。另外我們西創會每周也都組織沙龍活動,每次都是通過公眾號發布,讓大家在meetup報名,但是每次去點的人總不多。過幾天大家忘了有什么活動又會來問。另外還有比如約開會時間也要統一半天,一般都用Doodle但是使用體驗很差。所以我才做了這個微群日歷,能幫助大家提升協作的productivity。
好了,說說干貨。在開始之前一定要做好心理準備,因為有些坑對海外黨實在太困難了。某種意義上說,我們基本就是外星人。
首先你要注冊和備案。
1. 基本要求
- 國內要有公司,各種證件要全。
- 國內得有人幫你做認證,需要接電話什么的。
- 一定要申請國內ICP備案。
2. 再說備案,坐標海外
如果想在海外做運營,服務器放在國內得慢成狗。海外的服務器雖然不需要備案。但是中國政府的規定是備案過的域名必須指向備案過的服務器,并且會定期掃描,如果發現服務器不對,可能會撤銷你的備案。
我在網上搜攻略,不少人說只要一個二級域名掛在國內就可以了。這點我還特地問過阿里云的客服,客服說是可以的,二級域名掛在國內并且有不少流量就行。比如你弄個cn.xxx.com可以指向國內。不管怎樣,你肯定是需要一個國內的服務器。
我的做法還要簡單一點,用了Azure的Global Traffic Manager,根據訪問地域不同指向不同服務器,這點我后面還會提到。
3. 特殊資質
之后你就可以開始開發了,但是如果你決定做某些特殊類目,趕緊開始申請特殊資質吧!
特殊類目包括教育、醫療、金融、出行、富媒體、電商、保健等各個方面,動手之前需要仔細了解清楚。
4.SSL證書
微信小程序要求后臺網站必須是HTTPS。關于證書以前我也沒弄過,原本想直接買個證書了事吧,一年花個幾百刀。不過后來一想,這證書每年都還要Renew也挺麻煩。不少公司都因為證書過期出過大事情。于是俺找了一圈,發現了一個好東西:Let’s Encrypt。
Let’s Encrypt是個非盈利組織,有兩個最大特點:
- 免費證書!不過只有三個月。
- 自動更新!之所以是三個月是因為Let’s Encrypt的理念是證書應該有自動Renew機制!像我上面說的,有好些大公司因為忘記Renew證書而網站出大問題的。
我在美國用的Azure Webapp,也有好心人做了插件:
5. 提升國內外速度——雙機
上面提到需要國內服務器備案的事情。如果直接用國內服務器的話,海外訪問速度會慢得離譜。比如你隨便打開一個小程序,基本是加載都要很長時間,怎么突破?自然是在海外再開一個服務器啦!
我用的Azure Global Traffic Manager(GTM),如果用戶來自東亞,我讓他訪問國內服務器,如果人在美國,則讓他訪問美國服務器。這樣如果ICP掃描的時候,自然會掃到我國內的服務器,備案也就沒有問題啦。
這么做的后果是,你需要維護兩臺服務器,對于小Startup而言,用戶原本就還沒有那么多,這樣完全是徒增煩惱。
一個做法是在國內直接proxy到美國,這樣最終還是訪問的美國服務器。當然后果是國內訪問會巨慢,如果你不在乎國內用戶的話倒也無所謂,不過在微信審核的時候確保他們加載什么沒有問題,要不小心審核不過噢。
還有一點要注意的是國內的證書問題,如果你跟我一樣用let’s encrypt的證書,在申請的時候需要DNS指向當前機器的IP,否則會失敗,但是let’s encrypt的機器肯定在國外,怎么辦呢?很簡單,我就先在GTM disable了美國的指向就行了。不過這里其實有個問題,就是多臺機器共用證書。如果機器在附近也倒是罷了,直接nginx做個反向代理。但是現在是跨國怎么辦?
一個做法是單獨開一個證書服務器,把nginx的/.well-known路徑指向證書服務器。這樣的壞處是這個證書服務器是你的一個bottle neck。我因為美國用的是azure webapp,本來就有很多限制,所以我目前的做法比較偷懶,兩邊各自刷新證書。后果是過幾個月中國那邊的服務器的證書可能沒法自動renew了,得手動再做一次。我對證書不是很了解,如果那位比較精通請跟我聯系~
6. 提交審核
開發的環境我先跳過,不過如何能這么快做完,我后面會稍微再講一下。當你吭哧吭哧開發完了,覺得滿意的時候,下面就是提交審核了。我的審核周期一般為兩天。特別要注意的是,一旦提交審核,不能撤銷,也不能覆蓋!你即使發現了bug fix了,也只有等審核完再說。所以提交審核要謹慎啊!
于審核的坑那可就是太多了,建議大家先網上查一查。有兩個我提出來:
-
類目選擇
提交的時候會問你要功能頁面,其實到現在我完全清楚功能頁面的作用,估計是以后小程序搜索直達你的功能頁面而不是主頁。不過限制完全是看不到用處在哪里。
提交的時候你可以選擇類目,比如我的微群日歷,有類似Doodle的功能。我第一次審核的時候填的日歷,被審核人員指出應該是投票,第二次才順利過關。
-
敏感詞過濾
這個說起了大家都懂,只是你可能會忘記,這個坑絕大部分人都踩過,幸好我在群里問了老司機,才給了我一條明路!
7.小結
好了,一些海外常見的坑就差不多就這些了。其實在國內的話也算是常規的東西了,主要就是:事先一定要做好調查,看看缺什么的東西,盡早補上。備案,資質等。
海外雙機的配置,開發,維護。
我為什么做這么快?
雖然標題中說16天,其實前后加起來只有12天開發,但實際上因為還有上班時間,滿打滿算加起來可能5-6天工作時間吧。
因為只有我一個人,所以也做包括產品設計,UX Design,Logo設計等等。我個人對這個速度還是挺滿意的,本來就是想練練手。一方面歸結于有這么好的小程序一個平臺,否則很容易就會花去幾個月時間,另一方面當然事先還做過一些調研才動手的,包括備案什么的,因為是斷斷續續的就沒有統計進去了。下面我稍微回顧一下,希望對大家有幫助:
- 想好要做什么。 這是最困難的,一般的App,網站可能還好點。但是小程序有這樣那樣的限制,想好要做什么花了我很長時間。這也導致我錯失一月九號第一波小程序的推廣,那一次的PR起嗎值上千萬啊,能迅速獲得一批早期種子用戶。
- Keep it simple。 原本想要寫這樣那樣的酷炫的東西,加各種功能,但是每次都會不斷的想怎樣才能簡化,我強烈認同簡單的才是好用的,盡量不要有多余的東西。所以除了下面這個選多個日期和時間的為了用戶體驗能簡單點稍微花了點功夫(雖然也有點丑,希望以后能優化),其它很多設計我是直接參照WeUI的樣式。所以之前提到的WeUI樣式庫對我幫助很大。
- 哪些不做? 或許你早就聽到過這個話了,但是自己做的時候才能體會到。很多功能,比如我的微群日歷,提醒這個重要功能花了很長時間決定先還是不做了。還是希望第一波出去能盡量多的收集用戶反饋,靜靜的看用戶使用習慣。
- 開發足夠Agile。 上面提到Web hosting我選擇Azure Webapp,一來是因為相對熟悉些,二來是因為Continous Deployment做得比較好。基本上我在Github Checkin了,Azure這邊就開始更新,自動部署。也不需要我登陸服務器什么的。而國內的阿里云服務器就沒有這么方便了,每次部署還挺麻煩的。
- Node.js。 從去年初開始接觸Node.js,感覺開發效率一下子提升了不少,可用的選擇很多了,以至于有點太多無從選擇。這次我就簡單的用了Express和Mongoose。MEAN stack去掉了Angular,變成了MAN stack。
- 多用SaaS,少自己維護。 我目前唯一用的SaaS就是有MongoDB接口支持的Azure DocumentDB。這個確實不錯,以前自己搭MongoDB Cluster老費勁了,還得維護。DocumentDB又沒有好的lib,一開始推出的時候我就建議支持Mongo的protocal,這下總算是實現了!不過要注意一點的就是,每一個Collection都是單獨計費,一不小心就多開了幾個Collection。
- Photoshop基礎技能。 雖然有設計師朋友,但是有些簡單的自己做反而更快。比如logo就是自己弄的,基礎的Photoshop技能還是需要學習一點。
來自:http://geek.csdn.net/news/detail/139143