平安科技移動開發二隊技術周報(特別版のReact Native專題)
<p>@author ASCE1885的 Github 簡書 微博 CSDN </p>隨著React Native For Android的發布,React Native儼然已經成為移動開發的一個熱門技術選型,本期周報簡單總結使用React Native進行開發所需要的技術儲備,入門React Native開發。
</blockquote>深入淺出 ES6 系列
ECMAScript 6已經正式發布了,作為它最重要的方言,Javascript也即將迎來語法上的重大變革,本系列文章就來看一下ES6將給我們帶來哪些新內容。
- ES6是什么
- 迭代器和for-of循環
- 生成器 Generators
- 模板字符串
- 不定參數和默認參數
- 解構 Destructuring
- 箭頭函數 Arrow Functions
- Symbols
- 學習Babel和Broccoli,馬上就用ES6
- 集合
- 生成器 Generators,續篇
- 代理 Proxies
</ul>深入淺出 React 系列
1)React的設計哲學 - 簡單之美
React最初來自非死book內部的廣告系統項目,項目實施過程中前端開發遇到了巨大挑戰,代碼變得越來越臃腫且混亂不堪,難以維護。于是痛定思痛,他們決定拋開很多所謂的“最佳實踐”,重新思考前端界面的構建方式,于是就有了React。
2)React開發神器Webpack
本文主要了解一下用于React開發和模塊管理的主流工具Webpack。稱之為React開發神器有點標題黨了,不過Webpack確實是筆者見過的功能最為強大的前端模塊管理和打包工具。雖然Webpack是一個通用的工具,并不只適合于React,但是很多React的文章或者項目都使用了 Webpack,尤其是react-hot-loader這樣的神器存在,讓Webpack成為最主流的React開發工具。
3)理解JSX和組件
JSX這種混合使用JavaScript和XML的語言第一眼看上去很“丑”,也很神奇,但是其語法和背后的邏輯卻極其簡單。相信讀完本文你就可以對JSX和組件有一個全面的了解,并能夠用JSX來直觀的構造用戶界面。
4)虛擬DOM Diff算法解析
React中最神奇的部分莫過于虛擬DOM,以及其高效的Diff算法。這讓我們可以無需擔心性能問題而”毫無顧忌”的隨時“刷新”整個頁面,由虛擬DOM來確保只對界面上真正變化的部分進行實際的DOM操作。React在這一部分已經做到足夠透明,在實際開發中我們基本無需關心虛擬DOM是如何運作的。然而,作為有態度的程序員,我們總是對技術背后的原理充滿著好奇。理解其運行機制不僅有助于更好的理解React組件的生命周期,而且對于進一步優化React程序也會有很大幫助。
React Native 探索系列
1)背景、規劃和風險
React Native項目成員Tom Occhino發表的React Native: Bringing modern web techniques to mobile詳細描述了React Native的設計理念。Occhino認為盡管Native開發成本更高,但現階段Native仍然是必須的,因為Web的用戶體驗仍無法超越 Native。
2)布局篇
布局篇主要講解了react布局的寬度,flex布局,圖片布局,定位和文本元素等。
3)與 react-web 的融合
對于react-native在實際中的應用, 非死book官方的說法是react-native是為多平臺提供共同的開發方式,而不是說一份代碼,多處使用。 然后一份代碼能夠多處使用還是很有意義的。
Flex 布局教程
1)語法篇
布局的傳統解決方案,基于盒狀模型,依賴 display屬性 + position屬性 + float屬性。它對于那些特殊布局非常不方便,比如,垂直居中就不容易實現。2009年,W3C提出了一種新的方案----Flex布局,可以簡便、完整、響應式地實現各種頁面布局。目前,它已經得到了所有瀏覽器的支持,這意味著,現在就能很安全地使用這項功能。
2)實例篇
上一篇文章介紹了Flex布局的語法,今天介紹常見布局的Flex寫法。你會看到,不管是什么布局,Flex往往都可以幾行命令搞定。
其他
1)React Native For Android初體驗
React Native For Android提前發布了,代碼托管在Github上面,本文是一個嘗鮮體驗,主要介紹環境配置的過程。
2)React Native: Android 的打包
本文介紹 React Native 中的資源打包,重點介紹使用 react-native-gradle 插件進行 Android APP 的打包。
3)React Native For Android 架構初探
非死book 在2015.9.15發布了 React Native for Android,把JavaScript 開發技術擴展到了Android平臺。React Native 讓開發者使用 JavaScript 和 React 編寫應用,利用相同的核心代碼就可以創建 基于Web,iOS 和 Android 平臺的原生應用。本文將淺析Android React的架構及相關基礎知識。
4)React Native通信機制詳解
React Native是非死book剛開源的框架,可以用javascript直接開發原生APP,先不說這個框架后續是否能得到大眾認可,單從源碼來說,這個框架源碼里有非常多的設計思想和實現方式值得學習,本篇先來看看它最基礎的JavaScript-ObjectC通信機制(以下簡稱JS/OC)。
5)顛覆式前端UI開發框架:React
基于HTML的前端界面開發正變得越來越復雜,其本質問題基本都可以歸結于如何將來自于服務器端或者用戶輸入的動態數據高效的反映到復雜的用戶界面上。而來自非死book的React框架正是完全面向此問題的一個解決方案,按官網描述,其出發點為:用于開發數據不斷變化的大型應用程序(Building large applications with data that changes over time)。相比傳統型的前端開發,React開辟了一個相當另類的途徑,實現了前端界面的高效率高性能開發。
匯總
1)React-Native入門指南
React Native入門的系列教程,主要針對iOS版本。
2)React-Native學習指南
本指南匯集React-Native各類學習資源,給大家提供便利。
3)Awesome React Native
另外一個React Native資源的匯總
4)讀讀日報:React Native(Android & iOS)
讀讀日報上面對React Native相關文章的專題。
文末攝影鑒賞
</blockquote>
本文由用戶 bger 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!