隨著正式開放公測,微信小程式再次萬眾矚目,越來越多的企業和個人湧入到小程式開發的大軍中。小程式究竟是什麼?適合做小程式的產品有哪些?做小程式需要提前準備什麼?如何零基礎學做小程式?此文,將列出OSC上優質的資源供大學瞭解和學習。
一、新手入門
有關小程式的入門,首選自然是官方文件。 它解釋了基本概念,有簡單的設計指南和開發教程,能讓你很好地對小程式有初步理解。
看完這些你會發現,小程式主打的是比APP更輕量的形態,簡單的開發,卻接近app的體驗,無需下載,掃碼開啟。那麼,一些剛需且高頻的金融類、電商類、教育類等其實是不適合接入小程式的。這些對功能的要求都很重,小程式難以承載。而且小程式不能像微信公眾號一樣被關注、群推送訊息以及轉發朋友圈,這也就意味著,它沒有辦法獲取使用者更多的資訊,也不便於深度營銷。
小程式適用哪些產品?
- 功能很輕,用完即走的,如剛需且低頻的服務類、旅遊類等
- 基於社交場景的輕應用,或者說基於輕社交的應用
- 非即時、可非同步的應用
- 初創型企業的MVP產品
- 開發和設計能力有限的產品
- 以及更多……
這些不錯的資源你可能也會感興趣:
- 【微信小程式開發•系列文章一】入門,這篇是 jsongo0 編寫的系列文章的第一章,包含了小程式的介紹和前期準備工作。
- memda 的 5款微信小程式開發工具使用報告,可以幫助你提前選擇合適的開發工具。
- 騰訊Bugly 的 聊一聊微信小程式,這篇文章裡有多位開發人員對小程式的看法,以及利弊探討等等,能更好的理解小程式理念和適用場景。
- 小程式的 API 文件 (非官方)。
二、開發實戰
從9月22日凌晨微信小程式開始內測,就有不少開發者搶先進入小程式進行體驗,並發表了大量的開發實戰文章。這其中,有針對各個步驟、環節詳細的開發教程、有針對單個專案的實踐經驗,有系列,有單篇……但對於初學者來說,都是極具有參考意義的資源。
1、博卡君 小程式開發系列教程:
在小程式公佈內測不到10小時內即“神速”推出的開發系列教程,轟動一時。該系列內容從基礎知識到專案例項都有詳細表述,博主每日吐血趕稿,可歌可泣。:)
- 全球首個微信小程式(應用號)開發教程!通宵吐血趕稿 —— 序言、準備工作、專案構架
- 第二彈!全球首個微信小程式(應用號)開發教程 —— 專案例項:結構以及配置、首頁面開發
- 第三彈!全球首個微信小程式(應用號)開發教程 —— 專案例項:名片夾詳情頁、個人頁面開發
- 第四彈!全球首個微信小程式(應用號)開發教程 —— 專案例項:編輯名片頁面開發
- 第五彈!全球首個微信小程式(應用號)開發教程 —— 專案例項:分組開發與左滑功能實現
- 第六彈!全球首個微信小程式(應用號)開發教程 —— 專案例項:拍照收納開發以及刪除名片等
2、 jsongo0 小程式開發系列教程:
和博卡君更偏向專案例項的講解不同,jsongo0的系列文章更偏向從理論著手,對小程式各個特性、功能、版塊進行了詳細的分析與解讀,並賦予獨有的實踐思路,內容詳細全面,值得深看。(第一章在“新手入門”部分)
- 【微信小程式開發•系列文章二】檢視層
- 【微信小程式開發•系列文章三】資料層
- 【微信小程式開發•系列文章四】模組化
- 【微信小程式開發•系列文章五】主介面
- 【微信小程式開發•系列文章六】生命週期和路由
- 【微信小程式開發•系列文章七】websocket
3、騰訊Bugly 小程式開發思考總結:
本文針對作者自己開發的“信用卡還款”專案,進行實踐總結和思考,從建立專案,到編寫程式碼,到執行、生成等等,整個過程都進行了詳細的記錄和說明,值得參考。
4、秀傑 小程式開發系列教程:
同樣是實戰系列開發教程,針對記賬應用進行了詳細的講解。作者在更新該系列的同時,還更新了開發新聞客戶端、開發加法計算器應用、實現購物車頁面等實戰課程,實力毋庸置疑。
- 微信小程式實戰課程之記賬應用開發
- 微信小程式實戰課程之記賬應用開發 —— 使用者註冊與登入
- 微信小程式實戰課程之記賬應用開發(續)—— 實現整合日期元件
- 微信小程式實戰課程之記賬應用開發(續二)—— 服務端登入篇
- 微信小程式實戰課程之記賬應用開發(三)—— 服務端實現賬目CRUD
- 微信小程式實戰課程之記賬應用開發(完結)—— 對接服務端賬目CRUD
這些不錯的資源你可能也會感興趣:
- EarlGrey 的 手把手教你微信小程式開發,參考Demo一步一步實現小程式開發。
- 用 cnode 社群 api 做微信小應用 例項教程,兩位老司機主講。
- andot 的 如何在微信小程式中使用 Hprose,據說是獨門絕技。
- 風程式 的 微信小程式開發教程,步驟都列出來了。
- Phodal 的 使用 WebStorm 讓你的「微信小程式」執行在Chrome瀏覽器上。
三、DEMO 原始碼
在實戰之初,有些原始碼能夠參考那真是極好的。目前碼雲上公佈原始碼的和小程式相關的Demo已經非常非常多,各個型別的都有,在此僅列出部分,更多可在碼雲上搜尋。
微信小程式版簡易情緒播放器 Demo
上文提到的實戰課程之記賬軟體開發 Demo。該作者還發布了靈犀新聞客戶端、靈動電商開源系統等等基於小程式的 Demo 原始碼,以及下拉選單、單選按鈕等元件原始碼,都可去看看。
仿【微信】APP
4、WechatSmallApps —— oopsguy
豆瓣圖書+知乎日報 Demo
5、weixincalculator —— Edik
計算器 Demo
6、wxapp-Breakfast —— hayeah
小林早廚 Demo
7、SmallAPP —— qieangel2013
購物 Demo
四、教學視訊
在參考文字的操作過程中可能會出現一些難以發現的小問題,導致最終跑起來會有點瑕疵。因此,對照視訊進行操作不失為更直觀的學習方式。
1、博卡君 小程式 Demo 視訊
在內測期間更新完多篇開發實戰教學文章後,博卡君釋出了 Demo 的演示視訊,並對系列教程進行了總結,發表了開發感悟。在小程式正式公測後,再次更新了專案真機實測 Demo 視訊。
視訊地址:
2、秀傑 小程式加法計算器視訊
微信小程式(應用號)零基礎課程之加法計算器應用。
視訊地址: