ReactNative填坑之旅–重新認識RN

桃子紅了吶發表於2017-11-16

如同黑夜裡的一道光一樣,就這麼知道了F8. F8是每年一次Facebook每年一次的開發者大會。每次大會都會release相應的APP,iOS、Android都有。之前都是用Native開發的,但是2016的這一次是用React Native開發的。

FB開源了RN的App

這次fb不僅開源了純RN寫的App,而且一同釋出的還有開發這個App的教程。FB承諾會不斷的更新這個app。教程放在make it open。不幸的是這個站點居然被牆了!!!技術博也能被牆,心中跑過一萬個草泥馬!!!F8的App可以在app store和google play下到。不要著急下,我麼先一睹F8的風采。

ios f8

App的設計本身是沒的說,而且兩個平臺的App都遵守了各自平臺的設計規範。iOS的用底部的Tab bar,Android的用了側邊劃入的選單。Android的還沒來得及用,在低版本、低配置的Android裝置上尤其能反映出RN的效能如何。

facebook在F8教程中提到在fb的內部團隊使用了RN後,app有大約85%的程式碼是可以重用的。這是著實減少了很多的開發量。而且使用RN可以快速的開發出app原型。

RN應用處理資料

在應用的開發中少不了需要處理一些資料。F8 使用了Parse實現了後端的功能。Parse很適合作為對資料依賴不那麼強的應用的後端。具體Parse如何使用,各位可以檢視文件。我們集中討論RN應用。

一直以來RN都被認為是MVC模式裡處理“View”部分的。但是React本身的特點又讓這些略有改變。幾個React元件組成了一個view,每一個元件內部都可以包含一些邏輯處理的程式碼。而這些邏輯處理的程式碼本來應該是由controller來處理的。

React提供了一種開發模式Flux。RN裡就可以使用了Flux模式的最佳實踐庫ReduxRedux引入了Store的概念,提供了一個新的修改state的工作流,擴充套件了React的資料關係。你可以參考Flux如何使得React應用實現單向資料流的。

F8有一點需求,需要可以離線使用。正好Redux提供了可以儲存和快取方面的功能。用fb教程的話來說:“Redux提供了功能和易用的最佳平衡”。

其他

很多的公司雖然使用了React,但是沒有使用Flow。這裡有填坑番外來介紹flow的使用方法。Flow是fb為了保證js開發的時候能儘早,儘可能多的發現錯誤而開發的一款開源工具。

有很多的js錯誤,你不需要在程式碼執行起來以後才發現錯誤。只要幾個flow命令就可以檢測出來。如果使用Nuclide,這個React專用的開發工具的話,Flow會在你寫完程式碼之後就給出提示。非常有幫助。

最後

這些應用開發的只是,以及開發對於開發一款React Native應用都有非常大的幫助。F8是一個開發和幾個幫忙的設計開發出來的App。其中所使用的開發知識,第三方庫和開發工具對於開發React尤其是React Native應用來說不是必不可少、也是非常有益的。學習掌握他們對於我們以後的開發都是大有裨益的!

歡迎加群互相學習,共同進步。QQ群:iOS: 58099570 | Android: 572064792 | Nodejs:329118122 做人要厚道,轉載請註明出處!

本文轉自張昺華-sky部落格園部落格,原文連結:http://www.cnblogs.com/sunshine-anycall/p/5996518.html,如需轉載請自行聯絡原作者


相關文章