Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
載鏈接:https://www.jianshu.com/p/11fe9401874c
此系列文章將整合我的 React 視頻教程與 React Native 書籍中的精華部分,給大家介紹 React 與 React Native 結合學習的方法。
我們在開始系列文章的技術點內容前,花一點時間探討一下軟件開發語言以及框架的學習本質,相對于整個技術點的講解,花這一點一起思考的時間是值得的。
相信看此系列文章的朋友都已有了非常多的軟件開發經驗,而當我們回顧語言與框架的學習過程時,所有語言的基礎語法都大同小異,無非基礎數據類型、條件判斷、分支判斷、循環處理等等。而差別或者說最重要的是在框架的底層本質,也就是為什么會產生此框架、底層的優勢是什么、為什么不用別的框架、框架的底層與設備之間是如何實現通信的等等。
截圖
我們在開發的過程中,遇到的一些基礎語法問題、框架使用問題,基本上只要靈活使用一下搜索引擎都能找到答案,有句話說:你要相信你遇到的技術難題在這個世界上肯定有其他人也遇到了。
而當我們需要抓住本質,對語言與框架有更加深入地了解、進行技術選型時、知道每一種技術的優劣、當框架的表現出現了一些詭異問題時會迅速定位問題、優化項目的性能,以及成為某一領域的專家時,最高效的學習方法就是直接去接觸語言與框架的底層本質。
如 JavaScript 中的深拷貝與淺拷貝,如果只是進行數據類型的深拷貝與淺拷貝,即使你忘記了處理邏輯,你只要通過搜索引擎搜索就可以找到很多的實現方法,而如果你想一次掌握好此知識點,那么就需要你直接去學習數據結構以及數據類型對應的值類型與引用類型的區別,只有在掌握此部分的知識點后,在遇到數據類型的「詭異」表現時你才能抓住問題本質。
再如你在使用 React Native 框架提供的各種組件與 API,如訪問移動設備的相冊與攝像頭、震動、GPS 定位、網絡狀態、消息推送以及整個 React Native 框架生態下提供的成千上萬的第三方功能組件時,其實底層都是 React Native 框架與 iOS、Android 平臺通信的實現。在原理章節掌握了原理后,后續的章節我們還會一起自己動手來實現一個與 iOS、Android 平臺通信的自定義組件。
學習、精通語言與框架最好的方法就是直接掌握其最本質的部分。
React 框架最早孵化于 Facebook 內部,作為內部使用的框架,在 2011 年的時候 React 框架被用于 Facebook 的新聞流并于 2012 年使用在了 Instagram 項目上。在 2013 年五月美國的 JSConf 大會上,React 框架項目被宣布了開源。
在移動開發方面,Facebook 曾致力于使用 HTML 5 進行移動端的開發,最終發現與原生的 App 相比,體驗上還是有非常大的差距,并且這種差距越來越大,特別是性能方面的差距。 最終,Facebook 放棄了 HTML 5 的技術方向,結合之前介紹的 React 框架的發展歷史,2015 年 3 月,Facebook 正式發布了 React Native 框架,此框架專注于移動端 App 的開發。
React 作為構建高性能 Web 應用的框架,React Native 作為構建跨 iOS 與 Android 平臺 App 應用的框架,極其繁雜的開發生態造成了很多朋友對 React / React Native 框架產生了些許誤解,認為框架太過龐雜混亂,造成了學習成本與開發成本的增加。
此系列文章將帶領大家深入探究 React 與 React Native 框架的本質,只有在掌握了框架本質后,才能快速地領略到這兩個孿生框架的核心,不僅可以在這兩個框架間靈活切換學習,還可以不被繁雜的框架生態所蒙蔽,最終達到以不變應萬變的境界。
從上面的 React 與 React Native 簡介即可看到,兩個框架算是孿生項目,而 React Native 的底層也就是 React 框架。
截圖
React 框架使用 JSX(JavaScript eXtension,可以理解為看起來像 HTML 的 JavaScript)指定 React 組件的輸出定義,而邏輯函數的部分依然是采用 JavaScript ES6 來編寫,所以對于前端開發人員來說上手非常地容易。
編寫的代碼通過 React 框架渲染在 Web 瀏覽器中運行,所以 React 可以用來開發 Web 項目,當然借助第三方的組件還可以開發桌面項目,這些我們在后續會進行相關介紹。
React Native 依然由 JSX 進行組件布局的開發,框架中組件開發的原理與思想與 React 框架一致,而且底層都由最重要的 state 進行驅動。
React 與 React Native 除了在編碼表現層都使用 JSX 語法外,在 React 與 React Native 的底層都有 Virtual DOM 與 DOM 之間的映射與轉換,以實現了頁面組件高效更新的前端表現。
截圖
用戶看到的表現層(Browser DOM)的更新,底層都是由 state 驅動了 Virtual DOM 進行變動前與變動后的比較,最終將需要重新渲染的 DOM 進行渲染展示。
而這種通過只修改 state (Model) 值引起 HTML (DOM) 變化的框架設計模式就是我們熟悉的 MVVM (Model-View-ViewModel) 模式。
以前我們可以通過直接操作 HTML 元素的形式進行頁面的更新,如下面的這段 jQuery 代碼。
$('#container').text('Updated Content...')
當這樣的代碼在頁面更新非常復雜的項目中使用時,你會疲于通過操作 DOM 元素更新,映射后臺大量的數據更新。
截圖
而 MVVM 模式,如目前的前端框架 Vue、Angular 和我們介紹的 React 都是基于此設計模式,將頁面呈現 View 與后臺的數據模型 Model 進行了分離解耦,使得我們只需要專注于 Model 的處理,通過修改 Model 中的屬性值,引起前端 View 的變化,不過 React 默認的數據綁定方式是單向綁定,這一部分的差異我們后續章節會展開討論。
對于 MVVM 模式的體驗以及如何通過修改 Model 引起 View 的更新,大家可以查看下一小節,我會給大家具體的代碼演示。
而目前的移動端開發方面,「原生開發」是指 iOS 平臺通過 Objective-C 或 Swift 語言開發并通過 Xcode 編譯打包發布 iOS App,Android 平臺通過 Java 語言開發并通過 Android Studio 編譯打包發布 Android App。
通過下圖我們可以看到「原生開發」的學習成本以及后期 App 維護的成本,而 React Native 則是通過 JavaScript 開發,然后通過框架提供的與對應平臺之間的 bridge 進行通信,實現了只用一套代碼可以直接部署到 iOS 與 Android 平臺并編譯出對應平臺的 App。
截圖
并且 React Native App 頁面布局直接通過 HTML 和 CSS 的前端基礎技術進行布局與開發,大大降低了學習成本。
你如果早就在心里有開發一個自己 App 的想法,而剛好你有前端開發的技能,React Native 一定會是你孵化自己 App 最好的選擇。
本系列文章會從 React 的基本使用方法開始,并會講解到 React 的底層原理,并從一些實際案例中探討出 React 底層對于前臺表現的原因。底層原理會結合獨立的算法以及 React 框架的源碼進行詳細解釋。
之后會講解演示 React Native 的基本使用,同時會解釋 React Native 框架與 React 框架的關系、React Native 的性能問題、以及 React Native 與 iOS、Android 平臺通信的原理,拋卻 React Native 紛雜的各種類庫,直達 React Native 的底層原理,掌握了原理后才能看懂所有表象的類庫實現原理。并會動手自己實現 iOS 平臺與 Android 平臺的自定義組件,深入掌握各種第三方組件的實現原理。
「React.js 入門與實戰」視頻教程
《React Native 精解與實戰》書籍
更多免費原創視頻教程
需要相關資料,關注我,私信我回復:React和React Native 學習資料
這一小節給大家描繪了整體安排以及學習的本質,接下來我們會先從 React 底層原理開始,掌握好這兩個框架最本質的部分。
任何知識的學習過程都不會是「舒服」的過程,只有跳離自己的舒適區,才能有進步,所以遇到任何疑問或想交流的問題,大家只需在文章下留言即可,我都會與大家交流。
著移動應用的需求越來越大,許多企業開始將焦點轉移到移動應用的開發上。通過引入新技術、新平臺和新框架,移動應用開發者能夠創建劃時代的移動應用。
近年來,跨平臺應用開發非常流行,通過跨平臺的應用開發者編寫一份代碼就能同時為 Android、iOS、Windows 等多個平臺同時開發應用程序。
在眾多的開發利器中,React Native 是著名的跨平臺移動應用開發工具之一,它是由 Facebook 開發的,且是目前的最為活躍的開發者社區之一。
不過 Google 在 2017 年的 Google I/O 開發者大會上發布了他們自己的軟件開發工具(SDK):Flutter。今天,我們就來比較一下這兩個框架。
Flutter 的設計目標是在 iOS 和 Android 系統上創建高質量界面,它是 Google 的移動開發框架。同時,它也是免費的開源工具,能和現有代碼共同使用,甚至在最近越來越受歡迎。
Flutter 的優勢在于:
Flutter 擁有熱加載功能,只需幾毫秒就能運行應用程序。它的自定義窗體功能也可以用來創建原生界面。
快速交付的功能著重于原生的最終用戶體驗。多層的架構可以實現完全的定制化,從而得以實現靈活的設計和快速的渲染。
窗體覆蓋了所有基本的平臺之間的差異,同時擁有滾動、導航、圖標和字體等功能,同時為 iOS 和 Android 提供了完整的原生性能。
React
React 是個 JavaScript 庫,其具有高效、靈活的特性,而且使用聲明式來編寫用戶界面。開發者可以通過小型、獨立的代碼片段(所謂的“組件”)來構成復雜的 UI。
React 的功能
React Native 由 Facebook 于 2013 年開發。最常見的問題的解決方案都列在了 React Native 的開發文檔和指南中。社區論壇中還有許多開發者,對用戶每天遇到的問題做出了關鍵的貢獻,并輔助用戶解決這些問題。
通過閱讀貢獻者手冊,查閱 Roadmap,分析其他人的工作,你也可以為社區做出貢獻。你也可以尋找在社區中被詢問次數最多的、最流行的功能。
Flutter 文檔足夠讓你開始進行應用程序開發了。
Flutter Gallery 在其網站上演時了所有 Flutter 組件,你也可以參照 Flutter 的 GitHub 中的實現。
Flutter 的網絡不像 React Native 那么強大。但是,Google 的 Flutter 團隊提供的幫助非常好。
他們提供了許多方法讓你提交問題。
React Native 是個 JavaScript 庫,而 Flutter 是個 SDK,使用的是完全不同的編程語言 Dart。
JavaScript 最初的創建目的只是 Web 開發,但現在已經有了大量的其他函數庫,已經變得非常龐大,很少有地方沒有它的身影。
React Native 將動態的 JavaScript 代碼在運行時編譯成原生視圖。其余的代碼運行在應用程序內部封裝的虛擬機內。
Dart 是個通用語言,由 Google 開發。它可以用來構建網站、服務器、移動應用,也能用于物聯網設備。
Dart 受到了許多語言的影響。最強的影響來自 Java。Java 程序員可以很容易注意到兩者之間的相似性。
Dart 是個面向對象的編程語言,支持抽象、封裝、繼承、多態等。
Dart 程序可以在以下兩種模式下運行:
這種模式會啟用動態類型和斷言。如果代碼中提供了靜態類型,就可以打開類型斷言。在開發和測試階段建議使用檢查模式,有助于捕捉代碼中類型不匹配的錯誤。
這是所有 Dart 程序的默認模式。它能讓程序運行得更快。
盡管 Dart 提供了很多社區支持,但它仍然比不過 JavaScript 等其他主流語言,因此連知道 Dart 的人都很少。
Flutter 的框架使用函數式反應式編程,它受到了 React 的啟發。
雖然 Flutter 是用 Dart 寫的,但它借鑒了 React 最好的功能,幫助開發者建立漂亮、跨平臺的移動應用。
使用 React Native 的體驗很像使用不帶 CSS 框架的 HTML。
與 Flutter 應用不同,使用 React Native 時,必須使用一些第三方庫,因為 React Native 本身不提供UI組件
我們需要使用如 React Native、React Native Material Design、Shoutem 和其他 UI 庫。
Flutter 有自己的 UI 組件,其引擎能將組件渲染到 Android 和 iOS 平臺上。大多數組件都符合 Material Design 的標準。
Flutter 內置的組件可以用來開發應用程序的界面。這些組件叫做窗體(widget)。這里我們只需選擇正確的窗體并傳遞正確的屬性,就能獲得需要的界面。
Flutter 中的每個窗體都由自己的屬性,可以嵌套在其他組件中。窗體也能調用父組件的屬性。
在 React Native 中,使用原生模塊和用戶界面組件只需橋接就可以。但在 Flutter 中無法這樣做,因為 Flutter 有自己的渲染引擎。
這里是 Flutter 窗體(https://flutter.io/widgets/)的一些例子。
React Native 中的樣式用 JavaScript 定義。所有 React Native 的核心組件都支持一個名為 style 的屬性。
樣式名稱和值和 Web 上的 CSS 很相似。
唯一的區別就是,在 React Native 中的樣式名稱是用大小寫混合的。所以要定義背景色,需要使用 backgroundColor,而不是 background-color。
Flutter 中的樣式用法跟 React Native 不太一樣。下面這段 React Native 代碼定義了字體樣式和其他文本屬性,都由 CSS 處理。
var container = new Container( // grey box child: new Text( "Lorem ipsum", style: new TextStyle( fontSize: 24.0 fontWeight: FontWeight.w900, fontFamily: "Georgia", ), ), width: 320.0, height: 240.0, color: Colors.grey[300], );
如果用 Flutter 實現同一段代碼,將會是這樣:
import React, { Component } from 'react'; import { AppRegistry, StyleSheet, Text, View } from 'react-native'; export default class LotsOfStyles extends Component { render() { return ( <View style={styles.greybox}> <Text>Lorem Ipsum</Text> </View> ); } } const styles = StyleSheet.create({ greybox: { backgroundColor: #e0e0e0, width: 320px; height: 240px; font: 900 24px Georgia; } }) // skip this line if using Create React Native App AppRegistry.registerComponent('AwesomeProject', () => LotsOfStyles);
我們來更仔細低看看它的優缺點。
使用 Flutter 的五個優點
Flutter 意味著更快、更動態的移動應用開發。代碼中的改變可以立即在應用程序中看到,這就是所謂的熱加載,只需花幾毫秒,能幫助開發者更快地添加功能、修復 Bug 和試驗各種新東西。
熱加載也十分適合開發者和設計師之間的合作,可以試驗各種應用程序的外觀并立即看到效果。
換句話說,Flutter 可以讓設計師和測試者一起與開發者在 UI 上工作。
絕大多數代碼變更都可以熱加載。但有一些變更需要重新啟動應用,這些是熱加載的限制。
相比之下,在原生應用程序開發時,整個項目需要重新構建,這需要花很長時間,有時甚至會花上幾分鐘。
開發者只需寫一次代碼,就能在 Android 和 iOS 兩個平臺上運行。
Flutter 并不依賴于平臺,因為它有自己的窗體和設計,所以你可以在兩個平臺上擁有同樣的應用。當然,需要時你也可以做出不同的應用。
兩個平臺同樣的應用意味著需要的測試更少。QA 過程可以更快,因為只需要測試一份代碼。開發者只需要編寫一份測試代碼。
QA 專員的工作也會變少,因為他們只需要測試一個應用。如果不同平臺上的應用有差異,那么這些差異需要在各自的平臺上測試。
Flutter 的設計方式使得開發者很容易創建自己的窗體,或定制已有的窗體。你可以瀏覽許多 Flutter 窗體的例子(https://flutter.io/widgets/)、Material Design 的例子(https://flutter.io/widgets/material/)和 Cuptertino 窗體的例子(https://flutter.io/widgets/cupertino/)。
即使在舊版本的 Android 和 iOS 平臺上,應用的外觀也是一樣的。適配舊設備不需要額外的工作。Flutter 能在 Android Jelly Bean 之后的版本和 iOS 8 之后的版本上運行。
缺點
在 2018 年 4 月,Flutter 發布了 beta 2 版。Flutter 團隊還沒有發布穩定版本。
“我們仍然在嘗試將 API 穩定下來,同時根據用戶的反饋對系統的各個部分進行改進。一些關鍵功能還無法用于大范圍的應用。”Flutter 官網如是說。
這就是說,以后還會有更多的改變和改進。
很不錯,但用于原生開發還略顯不足。
Flutter 很優秀,有許多函數庫提供了很多功能。
但是,Flutter 依然很年輕,因此不一定能在函數庫中找到所有需要的功能。也就是說,開發者需要自行創建這些功能,有可能會花很多時間。
因為 Flutter 依然是 Beta 狀態,它還沒有受到 Travis、Jenkins 等 CI 平臺的廣泛支持。
為了實現自動構建、自動測試和自動部署,開發團隊必須開發并維護自己的腳本。
React Native 也只需要一份代碼(JavaScript)。它的視圖組件在 iOS 和 Android 中的行為不一樣。
盡管 React Native 有大量的社區支持,為我們提供了許多優秀的插件和庫,但這也意味著這些庫可能會和已有項目沖突。
如果你習慣了 JSX 環境,Fluttter 的 UI 代碼看上去有點無聊,而且在 UI 變得復雜之后代碼的可讀性也會變差。
與 React Native 相比,Flutter 的資源似乎并不多。主要原因就是 Flutter 的基礎還沒有 React Native 那么穩定。但作為 Beta 版,Flutter 的資源已經有了巨大的成長。
React Native 和 Flutter 都有自己的優缺點。React Native 有更多的社區支持,Flutter 依然很年輕,而 React Native 已經鋪好了路。
Flutter 看上去很吸引人,但還需要一些改進,還需要一些時間才能展示出潛力。
原文:https://medium.com/@surendervikram/flutter-vs-react-native-best-cross-platform-app-development-tool-16163e22618b
作者:Surender Vikram Singh,技術專家、企業家,有15年的全球開發經驗。
譯者:彎月,責編:屠敏
前我們已經介紹了2019 年 Vue 學習路線圖,而 React 作為當前應用最廣泛的前端框架,在 Facebook 的支持下,近年來實現了飛越式的發展,所以,我們將在下文中介紹 2019 年 React 學習路線圖,希望給想學 React 的開發者一些借鑒。
這就是 2018 年的 React 路線圖。它非常全面,2018 年剩下的時間可能不夠你學會所有這些,但不要擔心,所有的技術在 2019 年仍然有效。
圖片來源:https://github.com/adam-golab/react-developer-roadmap/blob/master/roadmap.png
不管你要學習哪個 Web 開發框架或庫,都必須掌握基礎知識,如 HTML、CSS 和 JavaScript,這三個是 Web 開發的三大支柱。
HTML
HTML 是 Web 開發人員最重要的技能之一,因為它為網頁提供了基本結構。
CSS
CSS 用于設置網頁樣式,讓網頁看起來更好看。
JavaScript
JavaScript 讓網頁具備交互性。React 是基于 JavaScript 的,因此在學習 React 之前,你應該先了解 JavaScript。
無論你是前端開發人員還是后端開發人員,甚至是全棧工程師,都必須了解一些能夠讓你在編程世界中生存下來的通用開發技能。
學習 GIT
你必須在 2018 年完全了解 Git。嘗試在 GitHub 上創建一些存儲庫,與其他人共享你的代碼,并學習如何在你喜歡的 IDE 中克隆 Github 上的代碼。
了解 HTTP(S) 協議
如果你想成為一名 Web 開發人員,那么了解 HTTP 絕對是有必要的。
我不是要你去閱讀 HTTP(S) 規范,但你至少應該熟悉常見的 HTTP 請求方法,如 GET、POST、PUT、PATCH、DELETE、OPTIONS 以及 HTTP/HTTPS 的工作原理。
學習終端
雖然前端開發人員學習 Linux 或終端并不是強制性的,但我強烈建議你熟悉以下終端,了解如何配置你的 shell(bash、zsh、csh)等。
算法和數據結構
好吧,這又是一個通用編程技能,成為 React 開發者不一定需要了解這些,但要成為真正的程序員,這是必備技能。
學習設計模式
就像算法和數據結構一樣,成為 React 開發者并不一定要學習設計模式,但學好設計模式會讓你變得更好。了解設計模式將幫你找到能夠經受住時間考驗的解決方案。
你必須學好 React 才能成為一名 React 開發者。學習 React 最好的資源是它的官方網站,但作為初學者,它對你來說可能有點難。
3.1 學習構建工具
如果你想成為一名專業的 React 開發者,那么你應該花一些時間熟悉一下你將作為 Web 開發者需要使用的工具,比如構建工具、單元測試工具、調試工具等。
以下是路線圖中列出的構建工具:
包管理器:
順便說一句,并非要學習所有這些工具,對于初學者來說,學習 npm 和 Webpack 應該足夠了。在你對 Web 開發和 React 生態系統有了更多的了解后,你就可以學習其他工具。
3.2 樣式
如果你的目標是成為 React 開發者,了解一些樣式相關的知識只會有益無害。路線圖中提到了很多 CSS 相關的東西,比如 CSS 預處理器、CSS 框架、CSS 架構和 JS 中的 CSS。
我建議你至少學習一下 Bootstrap,這是你經常會用到的 CSS 框架。
如果你想進一步學習 bootstrap,也可以學習 Materialise 或 Material UI。
3.3 狀態管理
這是 React 開發者應該關注的另一個重要領域。路線圖中提到了以下一些需要掌握的概念和框架:
如果東西太多,我建議你只關注 Redux。
3.4 Type Checker
由于 JavaScript 不是一種強類型語言,因此編譯器不會捕獲那些與類型相關的錯誤。
隨著應用程序的增長,你可以通過類型檢查捕獲大量錯誤,尤其是如果你可以使用 Flow 或 TypeScript 等 JavaScript 擴展對整個應用程序進行類型檢查。
React 也提供了一些內置的類型檢查功能,可以用它們幫你盡早發現 bug。
由于 Angular 也使用了 TypeScript,我認為可以同時學習 JavaScript 和 TypeScript。
3.5 Form Helper
除了 Type Checker 之外,還可以學習像 Redux Form 這樣的 Form Helper,它提供了在 Redux 中管理表單狀態的最佳方法。除了 Redux Form 之外,還有 Formik、Formsy 和 Final。
3.6 路由
組件是 React 聲明性編程模型的核心,而路由組件是應用程序的重要組成部分。
React Router 提供了一組導航組件,這些組件可以通過聲明的方式與你的應用程序組合在一起。
除了 React Router 之外,你還可以看看 Router 5 和 Redux-First Router。
3.7 API 客戶端
在今天的世界中,你很少會構建獨立的 GUI,相反,你將有更多機會使用 REST 和 GraphQL 等 API 構建與其他應用程序發生交互的東西。
值得慶幸的是,React 開發者可以使用很多 API 客戶端:
REST
GraphQL
Apollo 客戶端是我的最愛,它提供了一種使用 GraphQL 構建客戶端應用程序的簡便方法。Apollo 可以幫你快速構建使用 GraphQL 獲取數據的 UI,并可以與任意 JavaScript 前端一起使用。
3.8 輔助庫
這些庫可以讓你的工作變得更輕松。React 開發人員可以使用很多輔助庫,如下所示:
這些不一定都要學,路線圖中的 Lodash、Moment 和 Classnames 是用黃色標注的,所以應該先從它們開始學習。
3.9 測試
測試是 React 開發者的一項重要技能,但經常被忽視,如果你想在競爭中保持領先,就要學習一些用于測試的庫。這些庫可用于單元測試、集成測試和端到端測試。
以下是路線圖中提到的庫:
單元測試
端到端測試
集成測試
你可以學習你想學習的庫,但建議一定要學習 Jest 和 Enzyme。
3.10 國際化
這是前端開發的另一個重要主題。你可能需要支持日本、中國、西班牙和其他歐洲國家的本地 GUI 版本。
路線圖中建議你學習以下技術,它們都很好理解:
這兩個庫都提供了 React 組件和 API 來格式化日期、數字和字符串,包括復數和處理翻譯。
3.11 服務器端渲染
你可能會想,服務器端渲染和客戶端渲染之間有什么區別。在使用客戶端渲染時,你的瀏覽器會下載一個最小的 HTML 頁面,然后通過 JavaScript 并將內容填充到頁面中。
在使用服務器端渲染時,React 組件是在服務器上進行渲染的,將輸出的 HTML 內容傳到客戶端或瀏覽器。
路線圖推薦了以下的服務器端渲染:
不過我建議學習 Next.js 應該足夠了,Max 的“ React 16?—?The Complete Guide”也涵蓋了 Next.js 的基礎知識。
3.12 靜態站點生成器
Gatsby.js 是一個現代靜態站點生成器。你可以使用 Gatsby 創建個性化的登錄網站體驗。它將你的數據與 JavaScript 相結合,并創建格式良好的 HTML 內容。
3.13 后端框架集成
React on Rails 將 Rails 與 Facebook 的 React 前端框架(服務器渲染)集成在一起。它提供了服務器渲染,通常用于 SEO 爬蟲索引和 UX。
React Native 正迅速成為使用 JavaScript 開發具有原生外觀的移動應用程序的標準方法。
路線圖中建議你學習以下庫:
但我認為只要學習 React Native 就足夠了。
還有一些基于 React 的框架可用于構建像 React Native Windows 這樣的桌面 GUI,讓你可以使用 React 構建原生 UWP 和 WPF 應用程序。
路線圖建議使用以下幾個庫:
它們都是進階的內容,如果你已經掌握了 React,可以看一下它們。
如果你對構建基于虛擬現實的應用程序感興趣,還可以了解以下像 React 360 這樣的框架,讓你可以通過 React 開發 VR 體驗。如果你對這個領域感興趣,可以進一步了解 React 360。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。