React-Native 環(huán)境搭建和基本介紹
環(huán)境搭建準(zhǔn)備
1.環(huán)境搭建
React Native中文網(wǎng)
2.開發(fā)工具
前端開發(fā)軟件:Visual Studio Code
移動(dòng)端開發(fā)軟件:Xcode、Android Studio
3.知識(shí)儲(chǔ)備
NodeJS React Es6,Es7
React Native介紹

React Naitve的簡(jiǎn)介:Facebook在React.js Conf2015大會(huì)上推出的一個(gè)用于開發(fā)Android和iOS App的一個(gè)框架,主要編程語(yǔ)言是JavaScript。它的出現(xiàn)使用即擁有Native的用戶體驗(yàn),又保留React的開發(fā)效率。
在 React Native 出現(xiàn)前,我們通常會(huì)選擇這三種移動(dòng)技術(shù)(Native App、HTML5、Hybrid)之一進(jìn)行開發(fā)。
Native App:開發(fā)原生應(yīng)用自然性能最好,功能強(qiáng)大。但多平臺(tái)版本的開發(fā)、維護(hù)要花費(fèi)大量的人力物力(iOS版本迭代審核需要時(shí)間)。HTML5:雖然有 Web 的優(yōu)勢(shì),即靈活的布局能力、免發(fā)版的敏捷迭代潛力、優(yōu)秀的跨平臺(tái)特性。在新聞資訊等一些強(qiáng)排版、弱交互的展示類 App 上大展拳腳。但由于 WebView 在移動(dòng)設(shè)備上的性能制約,始終難成大器。Hybrid App:JS+Native兩者相互調(diào)用為主,從開發(fā)層面實(shí)現(xiàn)“一次開發(fā),多處運(yùn)行”的機(jī)制,成為真正適合跨平臺(tái)的開發(fā)。Hybrid App兼具了Native App良好用戶體驗(yàn)的優(yōu)勢(shì),也兼具了Web App使用HTML5跨平臺(tái)開發(fā)低成本的優(yōu)勢(shì),但是這個(gè)方法存在諸多問(wèn)題:無(wú)法訪問(wèn)離線數(shù)據(jù)、無(wú)法訪問(wèn)設(shè)備、無(wú)法遠(yuǎn)程更新。React Native:底層引擎是 JavaScript Core,但調(diào)用的是原生的組件而非 HTML5 組件。這樣運(yùn)行時(shí)可以做到與 Navive App 相媲美的性能體驗(yàn),同時(shí)因?yàn)?JavaScript 代碼可以使用后端強(qiáng)大的 Web 方式管理,既可以做到高效開發(fā),也可以實(shí)現(xiàn)快速部署和問(wèn)題熱修復(fù)。
React Native優(yōu)缺點(diǎn):
優(yōu)點(diǎn)
- 跨平臺(tái)開發(fā):運(yùn)用React Native,我們可以使用同一份業(yè)務(wù)邏輯核心代碼來(lái)創(chuàng)建原生應(yīng)用運(yùn)行在Web端,Android端和iOS端;
- 熱更新,App可以快速迭代:實(shí)時(shí)熱部署;
- learn once,write everywhere:React Native不強(qiáng)求一份原生代碼支持多個(gè)平臺(tái),所以不是write once,run anywhere;
缺點(diǎn)
- react native在iOS上僅支持
iOS7以上,Android僅支持Android4.1以上; - 開發(fā)成本較高,對(duì)新手不友好,調(diào)試不友好;
- 部分復(fù)雜的界面和操作,RN無(wú)法實(shí)現(xiàn)(可以考慮原生+React Native混合開發(fā));
- 版本更新較快,建議開發(fā)固定版本
React Native vs Flutter vs Weex

到此這篇關(guān)于React-Native 環(huán)境搭建和基本介紹的文章就介紹到這了,更多相關(guān)React-Native 環(huán)境搭建內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
詳解如何在React單頁(yè)面應(yīng)用中捕獲錯(cuò)誤
在當(dāng)前的Web開發(fā)中,使用React構(gòu)建單頁(yè)面應(yīng)用(SPA)已經(jīng)成為一種常見的做法,然而,當(dāng)應(yīng)用程序遇到錯(cuò)誤時(shí),有可能會(huì)導(dǎo)致整個(gè)頁(yè)面崩潰,給用戶帶來(lái)不好的體驗(yàn),本文將介紹如何在React單頁(yè)面應(yīng)用中捕獲錯(cuò)誤,以防止整個(gè)頁(yè)面的崩潰,需要的朋友可以參考下2023-09-09
React中使用Axios進(jìn)行HTTP請(qǐng)求
這篇文章主要為大家展示了如何在 React 中使用 Axios 進(jìn)行 HTTP 請(qǐng)求,包括 GET 和 POST 請(qǐng)求的使用,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-11-11
Reactjs實(shí)現(xiàn)通用分頁(yè)組件的實(shí)例代碼
這篇文章主要介紹了Reactjs實(shí)現(xiàn)通用分頁(yè)組件的實(shí)例代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下吧2017-01-01
React-Native左右聯(lián)動(dòng)List的示例代碼
本篇文章主要介紹了React-Native左右聯(lián)動(dòng)List的示例代碼,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
react實(shí)現(xiàn)同頁(yè)面三級(jí)跳轉(zhuǎn)路由布局
這篇文章主要為大家詳細(xì)介紹了react實(shí)現(xiàn)同頁(yè)面三級(jí)跳轉(zhuǎn)路由布局,一個(gè)路由小案例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-09-09

