理解 React 與 React Native

已發表: 2021-07-11

我們人類會混淆很多東西。根據事物的不同特徵，可能會產生混淆。與不同事物混淆的最常見方式是它們的名稱。

人們首先會知道一個新事物的名字。要么是另一個人，動物，產品，軟件等，他們會用他們的名字搜索，然後他們會知道不同的功能，應用程序，歷史等等，

為什麼會這樣？

是的，人們經常對術語（名稱） React和React Native感到困惑。如果非技術人員看到React和React Native這兩個名字，他們會認為在大多數情況下 Reactive Native 是 React 的擴展。如果他們在這些領域的知識為 0%，即使是一些技術人員也可能會以同樣的方式思考。

那些東西究竟是什麼？為什麼人們經常與他們混淆，而不是與其他人混淆？

React 和 React Native 是兩個框架。這些名稱看起來很相似，但它們之間多了一個單詞。所以，人們往往會因為名字乍一看而混淆。如果您有同樣的困惑，那麼您來對地方了，可以揭開它們背後的神秘面紗。

讓我們來了解一下。

反應

React 是一個 JavaScript 庫，用於構建單頁 Web 應用程序。它是為 Web 構建用戶界面（前端）的最流行的庫之一。也許我們可以說它是目前最受歡迎的圖書館。它由 Facebook 創建和維護。它也被稱為 ReactJS。

由於我有使用 React 的經驗，我可以說它的學習和構建既美觀又簡單。這是一個圖書館。因此，我們可以通過利用其功能來構建我們想要的任何東西。使用 React 開發應用程序時沒有嚴格的規則需要遵循。所以，我們會有自由。

React 有很多很酷的特性。讓我們來看看它們。

#1. 組件

在 React 中，一切都是組件。它就像 Web 應用程序的構建塊。我們可以通過組合小組件來形成大組件。每個組件都有自己的狀態和控制。組件控制用戶界面並根據其狀態決定向用戶顯示什麼。

在 React 中，組件就是一切。而且它們是可重複使用的。一次編寫，隨處使用。

我們需要非常小心地編寫組件。當我們的應用程序增長時，它使事情易於維護。如果我們在單個組件中編寫大量代碼，最終會成為我們維護的負擔。 React 組件應該小而甜。它們使開發人員的生活成為天堂和地獄。

#2. 虛擬DOM

您應該已經在按鈕內看到了類似加載程序的內容。而在社交媒體平台中，只要你按下它，點贊數就會增加。在網絡的早期，我們必須重新加載所有內容才能獲取信息。但是，現在需要更新的單曲會為我們刷新，而不會觸及其他東西。這是怎麼回事？

正如我們之前看到的，React 中的一切都是一個組件。瀏覽器維護 Web 應用程序元素的 DOM 結構。當 Web 應用程序的一部分需要更新時，我們必須使用 DOM 操作來更新它。 React 高效地做同樣的事情。

React 為其所有組件創建一個虛擬 DOM（DOM 的副本）。為了更新 Web 應用程序中的某些內容，React 將真實 DOM 與虛擬 DOM 進行比較。如果有任何更改，則 React 會觸發更新組件。

#3. 單向數據流

我們不能在沒有數據流的情況下將大量組件劃分為較小的組件。組件之間的數據流必須有某種方式。

React 允許我們以單一方向將數據從一個組件傳遞到另一個組件。數據從父組件流向子組件。並且子組件無法更新數據。由於數據流是單向的，因此無法將數據發送回父組件。

您可能首先認為它沒有多向數據流。但是，單向數據流使我們可以更好地控制多向數據流。

概述

還有許多其他功能，如 JSX、條件渲染等。他們是次要的。我們已經看到了 React 庫的主要特性。當談到 React 的應用程序時，我們幾乎可以用它構建任何類型的 Web 應用程序。 React 社區非常龐大。你可以找到很多與 React 一起工作的包。

反應本機

反應原生

React Native 是一個用於開發跨平台移動應用程序的 JavaScript 框架。它也是由 Facebook 創建和維護的。

你們中的大多數人都會對上述聲明感到驚訝。

我們可以使用單一框架為 Android 和 IOS 創建移動應用程序嗎？

如果您不關注科技世界的更新，那麼您就不可能知道它。是的，我們可以使用 React Native 創建跨平台（Android 和 IOS）應用程序。並且存在用於跨平台應用程序開發的其他框架。

React Native 是同類產品中最受歡迎的產品之一。由於本機應用程序中的 JavaScript 限制，這不是最流行的一種。但是，它在其發展領域大放異彩。即使是 Facebook、Instagram、Flipkart 等大公司也使用它。這並不意味著您應該使用它。這意味著我們可以使用 React Native 構建跨平台的生產級應用程序。

我在上面的段落中使用了一組稱為Native Applications的詞。這些是什麼？這不是某種新型的應用程序。本機應用程序是專門為特定平台創建的。適用於安卓手機的安卓應用程序、適用於 iPhone 手機的 IOS 應用程序、適用於 Windows 的 Windows 應用程序等，

什麼是與母語為陣營本土回事？談到它，React Native 根據我們的願望創建了一個適用於 Android 和 IOS 的本機應用程序。使用 React Native 開發的應用程序與 Android Studio for android 一樣是 native 的，對於 IOS 也是類似的。

也許創作者因此將其命名為 React Native。不是事實。

當談到 React Native 的功能時，有一大堆在等著我們。讓我們看看它們的一些主要功能。

#1. 跨平台

我們可以使用單一代碼庫同時為 Android 和 IOS 創建移動應用程序。它為公司節省了大量時間和金錢。

#2. 熱加載或實時加載

如果您有 React 或 React Native 應用程序的經驗，那麼您可能知道它。當我們更改代碼時，此功能會使用新的更新重新加載整個應用程序。我們不必每次更改代碼時都按下重新加載按鈕。更新代碼並查看更改。而已。除非有錯誤，否則我們不必等待任何事情。

對您來說，這似乎是次要功能。但是，如果您來自沒有任何框架的 android 開發，您就會理解這個特性在 React Native 中的價值。

#3. UI 庫和社區

React Native 中有很多內置的原生組件。我們可以直接使用它們，無需任何額外的設置或安裝。本機組件在各自的平台上看起來是本機的。 React Native 應用程序 UI 與 IOS 原生 UI 以及 Android 原生 UI 相匹配。 React Native 有類似於 React 的組件。

當涉及到社區時。它很大，而且還在不斷增加。當您陷入社區時，您可以毫無困難地從社區獲得幫助。

概述

您可以在 Internet 上找到 React Native 的許多其他功能。如果您要進行移動應用程序開發，也可以探索它們。前端開發人員還可以使用 React Native 開發本機應用程序。它使跨平台移動應用程序的開髮變得容易。

反應對比反應本機

React 和 React Native 之間有一些相似之處和不同之處。讓我們來看看它們。

說到 React 和 React Native 的應用，它們是完全不同的。但是，當談到原則時，它們看起來很相似。 React 和 React Native 都有組件。他們在各自的發展中遵循相同的原則。

他們都使用 JavaScript 語言進行開發。讓我們看看它們中的一個簡單的Hello, World應用程序。

反應

import React, { Component } from 'react'; import './App.css'; class App extends Component { render() { return ( <div className="container"> <h1>Hello, Wolrd!</h1> </div> ); } } export default App;

反應本機

import React from 'react'; import { Text, View } from 'react-native'; const App = () => { return ( <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}> <Text>Hello, world!</Text> </View> ) } export default App;

如您所見，它們都使用 React 包。兩個應用程序的語法看起來相似，因為它們使用稱為 JSX 的特殊標記。但是說到渲染部分，他們都用了不同的東西。 React 使用Virtual DOM， React Native 使用Native API進行 UI 渲染。

有一些外部包，如 Redux、MobX 等，用於 React 應用程序的語句管理。同樣的包也可以用在 React Native 應用程序中。

React 和 React Native 都使用 JavaScript。因此，我們幾乎可以將每個 JavaScript 包與它們一起使用。這為他們的兩個包庫添加了許多包。

React 和 React Native 是相互關聯的。但是，它們用於不同的目的。

結論

React 和 React Native 在最終產品和應用平台方面是不同的。但是，它們在各自應用程序的開發中遵循相似的原則。如果您可以學習 React 或 React Native 這兩個框架中的一個，您就可以加快學習另一個框架的速度。但是，開發 React Native 應用程序需要 React 知識。但是，這還不夠。我們需要更多地了解原生應用程序的開發，因為 React Native 的支持是有限的。

讓我們希望它最終能夠在未來得到全面支持。

如果您想開始 Web 或移動應用程序開發，那麼選擇 React 或 React Native 在未來肯定會讓您受益。但這不是強制性的。

如果您了解 JavaScript，學習 React 的概念是輕而易舉的事。官方文檔將是您開始使用 React 或 React Native 的絕佳資源。

快樂知道

標籤：