使用 Flutter 开发 Github 客户端及学习历程的小结
本文由 卻把青梅嗅?授權(quán)投稿
原文鏈接：https://juejin.im/post/5d14f3645188255c117c0fd6
本文筆者將嘗試分享個人針對Flutter的 學(xué)習(xí) 并 搭建一個Flutter應(yīng)用 的過程。
在這一個月學(xué)習(xí)Flutter的過程中，我不可避免的走了很多彎路，也許這并非壞事，但是還是希望將這些經(jīng)歷表述出來，有兩個目的：
為自己做一個周期性的總結(jié)
也希望能給想學(xué)習(xí)Flutter的讀者一定實質(zhì)性的參考
關(guān)于筆者總結(jié)的Flutter入門學(xué)習(xí)計劃，可直接跳轉(zhuǎn)文末的 Flutter入門學(xué)習(xí)計劃 小節(jié)進行查看。
契機
上個月25號，剛哥聯(lián)系我，問我有沒有興趣翻譯一篇Flutter的技術(shù)博客。
當(dāng)時我還沒有接觸Flutter，覺得這是一個督促自己學(xué)習(xí)的機會，就嘗試接下了這個任務(wù)。截止今天為止（6月25日）剛好一個月，在第一周保證翻譯任務(wù) 完成 之后，三周之后的今天，我基本實現(xiàn)了自己的另外一個目標(biāo)——搭建一個 Github客戶端。
這個項目運行之后，App整體效果是這樣的：
我將代碼托管在了自己的Github上：
https://github.com/qingmei2/FlutterGitHubApp
因為這是一個入門的項目，所以接下來也會從各方面深入學(xué)習(xí)Flutter，并反過來繼續(xù)完善和優(yōu)化它。
第一周：初識Flutter
最初學(xué)習(xí)Flutter的方式是通過學(xué)習(xí) wendux 老師的 《Flutter實戰(zhàn)》：
https://book.flutterchina.club/
這是一本非常優(yōu)秀的中文Flutter教程，對個人學(xué)習(xí)Flutter入門有非常大的幫助。
我根據(jù)這本小冊中的內(nèi)容完成了第一個 計數(shù)器 的入門案例，并對最常用的一些控件進行了熟悉和了解：
正如讀者所見，我跟著《Flutter實戰(zhàn)》 寫了若干的demo代碼，遺憾的是，效果并沒有想象的那么好，原因也很明顯，那就是我還沒有完全熟悉Dart的語法。
磨刀不誤砍柴工
學(xué)習(xí)Flutter的最開始，語法并非是最大的阻礙因素，因為對于熟悉Java語法的我們來說，Dart有很多相似之處，但隨著Flutter學(xué)習(xí)的不斷深入，有時一些Dart獨有的語法特性會給我?guī)砝Щ?#xff0c;比如 級聯(lián)操作符 、 var和dynamic關(guān)鍵字的區(qū)別 等等。
正如標(biāo)題所言，我發(fā)現(xiàn)我走入了一個誤區(qū)，Dart語法的學(xué)習(xí)勢在必行。
我學(xué)習(xí)語法的方式是通過翻閱Dart中文網(wǎng)：
Dart中文社區(qū)：http://dart.goodev.org/
第一周的感受
因為是空閑時間學(xué)習(xí)，因此嚴(yán)格來說學(xué)習(xí)時間并沒有那么多，最初的第一周，筆者花了幾個晚上，每天9點下班之后學(xué)2～3個小時，熟悉了Dart基本的語法和Flutter的最常用的基礎(chǔ)組件。
嚴(yán)格來說，此時個人依然處于小白水平，勉強摸到了入門的門檻。
私下里也會偷偷吐槽一下Dart和Flutter，布局寫著寫著下面連續(xù)十?dāng)?shù)行的 ）,）,）,）;）,）,},),},）;）,）,）,;）,},）; 真的令人不寒而栗……
第二周：狀態(tài)管理
因為當(dāng)初接翻譯任務(wù)時，自己給自己設(shè)定了10天的期限（也是為了督促自己學(xué)習(xí)），因此第二周我需要在前3天內(nèi)翻譯完這篇博客：
Widget-Async-Bloc-Service: A Practical Architecture for Flutter Apps
坦白來說，第二周的開始，這篇文章我看不懂，因此我需要學(xué)習(xí)Flutter開發(fā)過程中的架構(gòu)思想。
正所謂窺一斑而知全豹，雖然還沒有真正著手Flutter項目的開發(fā)，但是通過學(xué)習(xí)Flutter的核心——狀態(tài)管理，以及將 業(yè)務(wù)邏輯 和 UI的渲染 分開學(xué)習(xí)，再加上作為一個Android開發(fā)者，理解這些概念本身就有很大的優(yōu)勢，學(xué)習(xí)效率自然非常的高。
學(xué)習(xí)Flutter中狀態(tài)管理的資料，我強烈推薦 Vadaski 的系列文章。
Flutter | 狀態(tài)管理探索篇——Scoped Model（一）
Flutter | 狀態(tài)管理探索篇——Redux（二）
Flutter | 狀態(tài)管理探索篇——BLoC(三)
Flutter | 狀態(tài)管理拓展篇——RxDart(四)
Flutter | 狀態(tài)管理指南篇——Provider
冒昧推薦這幾篇關(guān)于狀態(tài)管理的文章，實際上 Vadaski 老師關(guān)于Flutter還有很多優(yōu)秀的博客，這里不一一列舉了，有興趣的朋友可以去拜讀一下。
如果讀者之前學(xué)習(xí)或者了解過Redux和ReactiveX相關(guān)的思想，狀態(tài)管理并不是非常難理解的概念。
熟悉了一系列Flutter狀態(tài)管理的實現(xiàn)方式之后，翻譯文章時就順暢很多了，幸不辱命，最終在第十天的凌晨將文章翻譯完畢：
《Flutter 移動端架構(gòu)實踐：Widget-Async-Bloc-Service》
完成之后，因為工作和私人的原因，第二周接下來幾天就沒有什么時間學(xué)習(xí)Flutter了。
第二周小結(jié)
第二周的學(xué)習(xí)成果實際上和第一周差不多，因為前三天全神貫注，同時每天晚上多學(xué)了一會，再加上吃了之前的老本（之前對于Redux的狀態(tài)管理和RxJava有一定的儲備），學(xué)習(xí)效率還是比較高的。
這周的感覺就是，雖然自己沒怎么上手項目，但是看了一些文章，對Flutter有了一些初步的認(rèn)識，總結(jié)如下：
因為Flutter本身采用的是React的思路，和我們認(rèn)知的 過程式開發(fā) 是不一樣的， 狀態(tài)管理 和 響應(yīng)式編程 是非常重要的概念，如果之前有相關(guān)的知識儲備，這個關(guān)鍵的知識點基本不會有什么難度，只需要關(guān)注API的使用就好了；當(dāng)然，沒了解過也沒關(guān)系，本小節(jié)上方的幾篇關(guān)于狀態(tài)管理優(yōu)秀的博客，也能夠幫助開發(fā)者非常快的進入Flutter的節(jié)奏中去。
類比是一個非常好的學(xué)習(xí)方式，對于Flutter中的一些概念或者庫而言：
RxDart和Stream相關(guān)的API和RxJava很相似
Future相關(guān)的API可以參考Kotlin的協(xié)程，通過同步的方式編寫異步的代碼
Provider其實也就是另一種方式的依賴注入
Redux就是參考前端的Redux引進的，沒有什么變化……
第三周：學(xué)習(xí)Widget
從結(jié)果來看，第三周我走了不少彎路。
第三周的最初，我認(rèn)為我需要開始深入學(xué)習(xí)Flutter中的Widget，因此我選擇fork了著名的 flutter-go, 并且開始嘗試跟著這個項目敲代碼。
在敲了幾天之后，我發(fā)現(xiàn)一個嚴(yán)重的問題，那就是這個學(xué)習(xí)過程中非常枯燥無聊，知識點之間沒有關(guān)聯(lián)性，感覺自己學(xué)了一個新的Widget，就忘了上一個Widget，沒堅持多久，我就hold不住了……
這也難怪，這個項目本身的目的就是 常用組件的demo演示與中文文檔, 我一個Widget一個Widget的用法跟著敲，這給了我一種 學(xué)習(xí)碎片沒有組織起來 的感覺，說白了就是不成系統(tǒng)，效果并不明顯。
因此我將 flutter-go 這個項目的定位變成了 工具書 ，接下來的學(xué)習(xí)過程中，每當(dāng)我對一個Widget的使用有了疑問，就隨手打開這個APP進行查閱這個Widget的用法，效果還不錯。
第四周：在實戰(zhàn)中學(xué)習(xí)
第四周我選擇了實戰(zhàn)開發(fā)，了解我的朋友應(yīng)該知道，我曾經(jīng)通過不同的開發(fā)模式（MVVM和MVI）開發(fā)過兩次Github的客戶端，這次我也不例外。
選擇以Github客戶端作為實戰(zhàn)的練手項目還有一個原因，那就是 戀貓de小郭 老師已經(jīng)開源了一個更強大的Github客戶端可以作為參考：
GSYGithubAppFlutter：https://github.com/CarGuo/GSYGithubAppFlutter
同時，戀貓de小郭 老師也有非常優(yōu)秀的Flutter系列博客，因為該系列文章太多了，就不一一列出了，強烈建議收藏閱讀。
所謂前人栽樹后人乘涼，GSYGithubAppFlutter 確實在我實踐過程中提供了很大的幫助，同時，因為第四周工作階段性告一段落，我有更多時間去學(xué)習(xí)Flutter，因此很快就把一個簡單的Github客戶端敲了出來。
階段性總結(jié)
在一個月的學(xué)習(xí)過程中，我學(xué)習(xí)到了很多東西，也感覺很多地方需要慢慢改進，也感覺到有很多知識點需要去補。
但是令我振奮的一點是，我成功從舒適區(qū)跳了出來，并且度過了學(xué)習(xí)新知識過程中最痛苦的一段時間（畏難情緒+新領(lǐng)域的陌生感）；
現(xiàn)在面對諸如 Kotlin和Flutter我學(xué)哪個比較好? 的問題，我也可以這樣回答了：
小孩子才做選擇，成年人當(dāng)然是全都要啦！
最后，衷心感謝文中提到的各位老師對個人的幫助，其實在學(xué)習(xí)過程中，我還參考了更多Flutter先驅(qū)者們優(yōu)秀的博客和代碼，實在難以一一列舉，在此深表感謝。
Flutter入門學(xué)習(xí)計劃？
如何入門Flutter？以個人經(jīng)驗來看，入門學(xué)習(xí)Flutter可以參考下面步驟：
通過《Flutter實戰(zhàn)》電子書完成一個簡單的計時器示例；
通過 Dart中文社區(qū) 學(xué)習(xí)語法；
繼續(xù)學(xué)習(xí)《Flutter實戰(zhàn)》，了解Flutter基本概念；
下載 flutter-go，將App下載到手機中作為工具書隨時隨地查閱；
學(xué)習(xí)一些優(yōu)秀的Flutter博客系列，比如上文中 Vadaski 和 戀貓de小郭 兩位老師的文章；
同時，下載優(yōu)秀的Flutter開源項目學(xué)習(xí)源碼；
選擇一個感興趣的項目或者方向進行實戰(zhàn)練習(xí)。
這個學(xué)習(xí)計劃 一定是有改進空間 的，也誠摯的希望您能在評論區(qū)留下寶貴的想法和建議，這也能夠為讀者提供更多參考性的建議，感謝！
推薦閱讀
破解付費美女直播視頻軟件
時隔4年，我的第二本書出版了
2019最前沿的幾個Flutter實踐
編程·思維·職場
歡迎掃碼關(guān)注
??在看也是一種認(rèn)可
總結(jié)
以上是生活随笔為你收集整理的使用 Flutter 开发 Github 客户端及学习历程的小结的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： python常用数学符号_数学菜鸟的AI
- 下一篇： 【机器学习】预测偏差与其原因