My lidé si splete se spoustou věcí. Zmatek může vzniknout na základě různých charakteristik věcí. Nejběžnějším způsobem, jak se splést s různými věcmi, jsou jejich jména.
Lidé se nejprve seznámí s názvy nové věci. Buď je to jiná osoba, zvíře, produkt, software atd., budou hledat podle svých jmen a pak se dozvědí o různých funkcích, aplikacích, historii atd..,
Proč to všechno je?
Jo, lidé se často pletou s pojmy (jmény) React a React Native. Pokud netechničtí lidé uvidí názvy React a React Native, budou ve většině případů předpokládat Reactive Native jako rozšíření React. Dokonce i někteří technici mohou uvažovat stejným způsobem, pokud mají 0% znalostí v těchto oblastech.
Co to vlastně jsou? Proč se lidé často pletou s nimi, ne s ostatními?
Reagovat a Reagovat Native jsou dva rámce. Jména vypadají podobně s jedním slovem navíc. Lidé se tedy často na první pohled pletou kvůli jejich jménům. Pokud máte stejné zmatky, pak jste na správném místě, abyste odhalili záhadu, která se za nimi skrývá.
Pojďme to zjistit.
Table of Contents
Reagovat
React je JavaScriptová knihovna používaná k vytváření jednostránkových webových aplikací. Je to jedna z nejoblíbenějších knihoven pro vytváření uživatelských rozhraní (frontend) pro web. Možná můžeme říci, že je to zatím nejoblíbenější knihovna. Je vytvořen a spravován Facebookem. Je také známý jako ReactJS.
Vzhledem k tomu, že mám zkušenosti s Reactem, mohu říci, že je krásné a přímočaré na učení a budování. Je to knihovna. Můžeme tedy stavět, co chceme a jak chceme, s využitím jeho funkcí. Neexistují žádná přísná pravidla, která by se měla dodržovat při vývoji aplikací pomocí React. Takže budeme mít svobodu.
React má tolik skvělých funkcí. Pojďme se na ně podívat.
#1. Komponenty
V Reactu je všechno komponenta. Je to jako stavební kámen webové aplikace. Můžeme vytvářet velké součásti kombinací malých součástí. Každá součást má svůj vlastní stav a ovládání. Komponenty řídí uživatelské rozhraní a na základě jeho stavu rozhodují, co se uživatelům zobrazí.
Komponenty jsou v Reactu vším. A jsou opakovaně použitelné. Napište jednou a použijte to všude.
Komponenty musíme psát s maximální péčí. Usnadňuje údržbu, když naše aplikace roste. Pokud napíšeme hodně kódu do jediné komponenty, bude pro nás nakonec zátěž, kterou musíme udržovat. Reagující složky by měly být malé a sladké. Dělají ze života vývojářů nebe i peklo.
#2. Virtuální DOM
Měli jste vidět něco jako nakladač uvnitř tlačítka. A na platformách sociálních médií se počet lajků zvyšuje, jakmile jej stisknete. V dřívějších dobách webu jsme museli vše znovu načíst, abychom získali informace. Nyní se však singl, který je třeba aktualizovat, obnoví, aniž bychom se dotkli dalších věcí. O co tady jde?
Jak jsme viděli dříve, vše v Reactu je komponenta. Prohlížeče udržují strukturu DOM pro prvky webové aplikace. Když potřebuje část webové aplikace aktualizovat, musíme ji aktualizovat pomocí manipulací DOM. React dělá totéž efektivně.
React vytvoří virtuální DOM (kopii DOM) pro všechny své komponenty. Chcete-li aktualizovat něco ve webové aplikaci, React porovná skutečný DOM s virtuálním DOM. Pokud dojde k nějakým změnám, pak React spustí aktualizaci komponenty.
#3. Jednosměrný tok dat
Bez datového toku nemůžeme rozdělit velkou sadu komponent na menší komponenty. Musí existovat nějaký způsob pro tok dat mezi komponentami.
React nám umožňuje předávat data z jedné komponenty do jiné komponenty jedním směrem. Data proudí z nadřazených komponent do podřízených komponent. A podřízené komponenty nemohou aktualizovat data. Neexistuje způsob, jak odeslat data zpět do nadřazené komponenty, protože tok dat je jednosměrný.
Můžete si nejprve myslet, že to není vícesměrný tok dat. Jednosměrný datový tok nám však poskytuje větší kontrolu nad vícesměrným datovým tokem.
Přehled
Existuje mnoho dalších funkcí jako JSX, podmíněné vykreslování atd.; jsou sekundární. Viděli jsme primární funkce knihovny React. Pokud jde o aplikace Reactu, můžeme s nimi vytvořit téměř jakýkoli typ webové aplikace. Komunita Reactu je obrovská. Můžete najít spoustu balíčků pro práci s Reactem.
Reagovat Native
React Native je JavaScript framework používaný k vývoji multiplatformních mobilních aplikací. Je také vytvořen a udržován Facebookem.
Většina z vás bude výše uvedeným tvrzením ohromena.
Můžeme vytvářet mobilní aplikace pro Android a IOS s jediným frameworkem?
Pokud nesledujete aktualizace ve světě technologií, není šance, že to poznáte. Ano, pomocí React Native můžeme vytvářet aplikace pro různé platformy (jak pro Android, tak pro IOS). A existují další rámce pro vývoj aplikací napříč platformami.
React Native je jedním z nejpopulárnějších svého druhu. Není to nejoblíbenější z důvodu omezení JavaScriptu v nativních aplikacích. Ale září ve svých oblastech vývoje. Používají ho i velké společnosti jako Facebook, Instagram, Flipkart atd. Neznamená to, že byste to měli používat. Znamená to, že s React Native můžeme vytvářet aplikace na produkční úrovni napříč platformami.
Ve výše uvedeném odstavci jsem použil skupinu slov nazvanou Nativní aplikace. Co jsou? Není to žádný nový typ aplikace. Nativní aplikace je vytvořena speciálně pro konkrétní platformu. Aplikace Android pro mobily Android, aplikace IOS pro mobily iPhone, aplikace Windows pro Windows atd.,
Co je s Native v React Native? React Native na základě našeho přání vytváří nativní aplikaci, která vyhovuje jak Androidu, tak IOS. Aplikace vyvinuté pomocí React Native jsou nativní stejně jako Android Studio pro Android a podobně pro IOS.
Možná ji kvůli tomu tvůrci pojmenovali React Native. Ne fakt.
Pokud jde o funkce React Native, čeká nás jich spousta. Podívejme se na některé z jejich hlavních funkcí.
#1. Víceplatformní
Můžeme vytvářet mobilní aplikace pro Android i IOS současně s jedinou kódovou základnou. Firmám to ušetří spoustu času a peněz.
#2. Hot nebo Live Reload
Pokud máte zkušenosti s aplikacemi React nebo React Native, pak o tom pravděpodobně víte. Tato funkce znovu načte celou aplikaci novými aktualizacemi, když změníme kód. Nemusíme mačkat tlačítko znovu načíst pokaždé, když změníme kód. Aktualizujte kód a podívejte se na změny. A je to. Nemusíme na nic čekat, pokud se neobjeví chyba.
Může se vám to zdát jako sekundární funkce. Pokud však přicházíte z vývoje pro Android bez jakéhokoli rámce, pochopíte hodnotu této funkce v React Native.
#3. Knihovny a komunita uživatelského rozhraní
V React Native je mnoho vestavěných nativních komponent. Můžeme je používat přímo bez dalšího nastavování nebo instalace. Nativní komponenty vypadají na příslušných platformách jako nativní. Uživatelské rozhraní aplikací React Native odpovídá nativnímu uživatelskému rozhraní IOS i nativnímu uživatelskému rozhraní Androidu. React Native má komponenty podobné React.
A pokud jde o komunitu. Je velký a neustále se zvětšuje. Když v ní uvíznete, můžete bez problémů získat pomoc od komunity.
Přehled
Na internetu můžete najít spoustu dalších funkcí React Native. Prozkoumejte je také, pokud se chystáte na vývoj mobilních aplikací. Frontendový vývojář může také vyvíjet nativní aplikace pomocí React Native. Usnadňuje vývoj mobilních aplikací pro různé platformy.
Reagovat vs. Reagovat Native
Mezi React a React Native jsou určité podobnosti a rozdíly. Pojďme se na ně podívat.
Pokud jde o aplikace React a React Native, jsou od sebe zcela odlišné. Ale pokud jde o principy, vypadají podobně. React i React Native má komponenty. A stejnými principy se řídí i v příslušném vývoji.
Oba používají pro vývoj jazyk JavaScript. Podívejme se na jednoduchou aplikaci Hello, World v obou.
Reagovat
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;
Reagovat Native
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 vidíte, oba používají balíček React. Syntaxe vypadá v obou aplikacích podobně, protože používají speciální označení nazvané JSX. Ale pokud jde o vykreslovací část, oba používají různé věci. React používá Virtual DOM a React Native používá Native API pro vykreslování uživatelského rozhraní.
Existují nějaké externí balíčky jako Redux, MobX atd., pro správu výpisů aplikací React. Stejné balíčky lze použít i v aplikacích React Native.
React i React Native používají JavaScript. Takže s oběma můžeme použít téměř každý balíček JavaScriptu. To přidá spoustu balíčků do obou jejich knihoven balíčků.
React a React Native spolu souvisí. Používají se však k různým účelům.
Závěr
React a React Native se liší z hlediska koncového produktu a aplikační platformy. Při vývoji příslušné aplikace se však řídí podobnými principy. Pokud se můžete naučit jeden ze dvou rámců, React nebo React Native, můžete urychlit učení dalšího. Pro vývoj aplikací React Native jsou však nutné znalosti Reactu. Ale na to to nestačí. Potřebujeme vědět více o vývoji nativních aplikací, protože podpora je v React Native omezená.
Doufejme, že se nakonec vyvine pro plnou podporu v budoucnu.
Pokud chcete začít s vývojem webových nebo mobilních aplikací, pak vám výběr React nebo React Native v budoucnu určitě pomůže. Ale není to povinné.
Naučit se koncepty Reactu je hračka znát JavaScript. Oficiální dokumenty pro vás budou skvělým zdrojem, jak začít s React nebo React Native.
Šťastné poznání 🙂