My, ludzie, mylimy się z wieloma rzeczami. Zamieszanie może wynikać z różnych cech rzeczy. Najczęstszym sposobem pomylenia różnych rzeczy są ich nazwy.
Ludzie najpierw poznają nazwy nowej rzeczy. Albo to inna osoba, zwierzę, produkt, oprogramowanie itp. Będą wyszukiwać po swoich nazwach, a następnie dowiadują się o różnych funkcjach, aplikacjach, historii itp.,
Dlaczego w tym wszystkim chodzi?
Tak, ludzie często mylą się z terminami (nazwami) React i React Native. Jeśli ludzie nietechniczni zobaczą nazwy React i React Native, w większości przypadków przyjmą Reactive Native jako rozszerzenie React. Nawet niektórzy technicy mogą myśleć w ten sam sposób, jeśli mają 0% wiedzy w tych obszarach.
Czym właściwie są te rzeczy? Dlaczego ludzie często mylą się z nimi, a nie z innymi?
Reagować oraz Reaguj natywnie to dwa frameworki Nazwy wyglądają podobnie z dodatkowym słowem między nimi. Tak więc ludzie często mylą się z powodu swoich imion na pierwszy rzut oka. Jeśli masz to samo zamieszanie, jesteś we właściwym miejscu, aby rozwikłać tajemnicę za nimi.
Dowiedzmy Się.
Spis treści:
Reagować
React to biblioteka JavaScript używana do tworzenia aplikacji internetowych z jedną stroną. Jest to jedna z najpopularniejszych bibliotek do budowy interfejsów użytkownika (frontend) dla sieci. Może można powiedzieć, że jest to obecnie najpopularniejsza biblioteka. Jest tworzony i utrzymywany przez Facebooka. Jest również znany jako ReactJS.
Ponieważ mam doświadczenie z Reactem, mogę powiedzieć, że jest piękny i prosty w nauce i budowaniu. To biblioteka. Możemy więc budować, co chcemy i jak chcemy, wykorzystując jego funkcje. Nie ma ścisłych zasad, których należy przestrzegać podczas tworzenia aplikacji w React. Będziemy więc mieli wolność.
React ma tak wiele fajnych funkcji. Przyjrzyjmy się im.
# 1. składniki
W React wszystko jest komponentem. To jest jak blok konstrukcyjny aplikacji internetowej. Możemy tworzyć duże komponenty, łącząc małe komponenty. Każdy komponent ma swój własny stan i kontrolę. Komponenty kontrolują interfejs użytkownika i decydują, co pokazać użytkownikom na podstawie jego stanu.
Komponenty są wszystkim w React. I są wielokrotnego użytku. Napisz raz i używaj go wszędzie.
Musimy pisać komponenty z najwyższą starannością. Ułatwia to utrzymanie, gdy nasza aplikacja się rozrasta. Jeśli napiszemy dużo kodu w jednym komponencie, jego utrzymanie w końcu stanie się dla nas ciężarem. Składniki React powinny być małe i słodkie. Sprawiają, że życie deweloperów jest zarówno piekłem, jak i niebem.
#2. Wirtualny DOM
Powinieneś zobaczyć coś w rodzaju modułu ładującego wewnątrz przycisku. A na platformach społecznościowych liczba polubień wzrasta, gdy tylko go naciśniesz. W dawnych czasach w Internecie musieliśmy ponownie ładować wszystko, aby uzyskać informacje. Ale teraz singiel, który wymaga aktualizacji, odświeży się dla nas bez dotykania innych rzeczy. O co w tym wszystkim chodzi?
Jak widzieliśmy wcześniej, wszystko w React jest komponentem. Przeglądarki utrzymują strukturę DOM dla elementów aplikacji internetowej. Kiedy część aplikacji internetowej wymaga aktualizacji, musimy ją zaktualizować za pomocą manipulacji DOM. React robi to samo skutecznie.
React tworzy wirtualny DOM (kopię DOM) dla wszystkich swoich komponentów. Aby zaktualizować coś w aplikacji internetowej, React porównuje prawdziwy DOM z wirtualnym DOM. Jeśli są jakieś zmiany, React uruchamia aktualizację komponentu.
#3. Jednokierunkowy przepływ danych
Nie możemy podzielić dużego zestawu komponentów na mniejsze komponenty bez przepływu danych. Musi istnieć jakiś sposób na przepływ danych między komponentami.
React pozwala nam przekazywać dane z jednego komponentu do drugiego w jednym kierunku. Dane przepływają z komponentów nadrzędnych do komponentów podrzędnych. A komponenty podrzędne nie mogą aktualizować danych. Nie ma możliwości odesłania danych do komponentu nadrzędnego, ponieważ przepływ danych jest jednokierunkowy.
Możesz najpierw pomyśleć, że nie ma wielokierunkowego przepływu danych. Ale jednokierunkowy przepływ danych daje nam większą kontrolę nad wielokierunkowym przepływem danych.
Przegląd
Istnieje wiele innych funkcji, takich jak JSX, renderowanie warunkowe itp.; są drugorzędne. Poznaliśmy podstawowe funkcje biblioteki React. Jeśli chodzi o aplikacje Reacta, możemy zbudować z nim prawie każdy typ aplikacji internetowej. Społeczność React jest ogromna. Możesz znaleźć wiele pakietów do pracy z React.
Reaguj natywnie
React Native to framework JavaScript używany do tworzenia wieloplatformowych aplikacji mobilnych. Jest również tworzony i utrzymywany przez Facebooka.
Większość z was będzie zdumiona powyższym stwierdzeniem.
Czy możemy tworzyć aplikacje mobilne na Androida i IOS za pomocą jednego frameworka?
Jeśli nie śledzisz aktualizacji w świecie technologii, nie ma szans, abyś to wiedział. Tak, możemy tworzyć aplikacje wieloplatformowe (zarówno Android, jak i IOS) za pomocą React Native. Istnieją też inne ramy do tworzenia aplikacji międzyplatformowych.
React Native jest jednym z najpopularniejszych tego typu. Niezbyt popularny ze względu na ograniczenia JavaScript w aplikacjach natywnych. Ale świeci w swoich obszarach rozwoju. Używają go nawet duże firmy, takie jak Facebook, Instagram, Flipkart itp. Nie oznacza to, że powinieneś go używać. Oznacza to, że możemy budować międzyplatformowe aplikacje na poziomie produkcyjnym za pomocą React Native.
W powyższym akapicie użyłem grupy słów zwanych aplikacjami natywnymi. Czym oni są? To nie jest jakiś nowy typ aplikacji. Natywna aplikacja jest tworzona specjalnie dla określonej platformy. Aplikacje na Androida na telefony komórkowe z Androidem, aplikacje IOS na telefony iPhone, aplikacje Windows na Windows itp.,
O co chodzi z Native w React Native? Przechodząc do tego, React Native tworzy natywną aplikację, która pasuje zarówno do Androida, jak i IOS, w oparciu o nasze życzenie. Aplikacje tworzone w React Native są natywne tak samo jak Android Studio dla Androida i podobnie dla IOS.
Może z tego powodu twórcy nazwali go React Native. Nie fakt.
Jeśli chodzi o funkcje React Native, czeka na nas ich cała masa. Zobaczmy niektóre z podstawowych funkcji z nich.
# 1. Wieloplatformowy
Możemy tworzyć aplikacje mobilne zarówno na Androida, jak i IOS w tym samym czasie z jedną bazą kodu. To duża oszczędność czasu i pieniędzy dla firm.
#2. Przeładowanie na gorąco lub na żywo
Jeśli masz doświadczenie w aplikacjach React lub React Native, to prawdopodobnie o tym wiesz. Ta funkcja przeładowuje całą aplikację nowymi aktualizacjami, gdy zmieniamy kod. Nie musimy naciskać przycisku przeładowania za każdym razem, gdy zmieniamy kod. Zaktualizuj kod i zobacz zmiany. Otóż to. Nie musimy na nic czekać, chyba że jest jakiś błąd.
Może ci się to wydawać drugorzędną funkcją. Ale jeśli zaczynasz od programowania na Androida bez żadnego frameworka, zrozumiesz wartość tej funkcji w React Native.
#3. Biblioteki i społeczność interfejsu użytkownika
W React Native jest wiele wbudowanych komponentów natywnych. Możemy z nich korzystać bezpośrednio, bez dodatkowej konfiguracji lub instalacji. Natywne komponenty wyglądają natywnie na odpowiednich platformach. Interfejs użytkownika aplikacji React Native jest zgodny z natywnym interfejsem użytkownika systemu IOS oraz natywnym interfejsem użytkownika systemu Android. React Native ma komponenty podobne do React.
A jeśli chodzi o społeczność. Jest duży i ciągle rośnie. Możesz bez problemu uzyskać pomoc od społeczności, gdy utkniesz w niej.
Przegląd
W Internecie można znaleźć wiele innych funkcji React Native. Zapoznaj się z nimi również, jeśli zamierzasz zająć się tworzeniem aplikacji mobilnych. Programista frontendowy może również tworzyć aplikacje natywne przy użyciu React Native. Ułatwia tworzenie wieloplatformowych aplikacji mobilnych.
Reaguj vs. Reaguj natywnie
Istnieją pewne podobieństwa i różnice między React i React Native. Przyjrzyjmy się im.
Jeśli chodzi o zastosowania React i React Native, to są one diametralnie różne. Ale jeśli chodzi o zasady, wyglądają podobnie. Zarówno React, jak i React Native mają komponenty. I kierują się tymi samymi zasadami w odpowiednim rozwoju.
Obaj używają języka JavaScript do programowania. Zobaczmy prostą aplikację Hello, World w obu z nich.
Reagować
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;
Reaguj natywnie
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;
Jak widać, obaj używają pakietu React. Składnia wygląda podobnie w obu aplikacjach, ponieważ używają one specjalnego znacznika o nazwie JSX. Ale jeśli chodzi o część renderującą, obaj używają różnych rzeczy. React używa Virtual DOM, a React Native używa Native API do renderowania interfejsu użytkownika.
Istnieje kilka zewnętrznych pakietów, takich jak Redux, MobX itp., do zarządzania instrukcjami aplikacji React. Te same pakiety mogą być również używane w aplikacjach React Native.
Zarówno React, jak i React Native używają JavaScript. Tak więc możemy używać prawie każdego pakietu JavaScript z obydwoma. To dodaje wiele pakietów do obu ich bibliotek pakietów.
React i React Native są ze sobą powiązane. Ale są one wykorzystywane do różnych celów.
Wniosek
React i React Native różnią się pod względem produktu końcowego i platform aplikacji. Ale kierują się podobnymi zasadami przy opracowywaniu odpowiedniej aplikacji. Jeśli możesz nauczyć się jednego z dwóch frameworków, React lub React Native, możesz przyspieszyć naukę innego. Jednak do tworzenia aplikacji React Native wymagana jest znajomość React. Ale to za mało. Musimy wiedzieć więcej o rozwoju aplikacji natywnych, ponieważ wsparcie w React Native jest ograniczone.
Miejmy nadzieję, że ostatecznie ewoluuje, aby uzyskać pełne wsparcie w przyszłości.
Jeśli chcesz zacząć tworzyć aplikacje internetowe lub mobilne, to wybór React lub React Native z pewnością przyniesie Ci korzyści w przyszłości. Ale nie jest to jednak obowiązkowe.
Nauka koncepcji Reacta to dla ciebie bułka z masłem znać JavaScript. Oficjalna dokumentacja będzie świetnym źródłem do rozpoczęcia pracy z React lub React Native.
Miłego poznania 🙂