Proč zkusit vývoj webu a webových aplikací v Reactu?

React je zde od roku 2013 a už se stihl stát jednou z nejvíce používaných a nejoblíbenějších JavaScript knihoven pro tvorbu webů a webových aplikací. Neustále se vyvíjí a zdokonaluje, a proto tuto revoluční technologii používá stále více společností a projektů. Co React vlastně je a co stojí za jeho popularitou?

Co je React.js?

React (neboli React.js) je frontendová javascriptová knihovna určená pro vývoj složitějších webů a jejich uživatelských rozhraní. Používá se tedy k realizaci grafického návrhu jednotlivých prvků, přidává do nich dynamiku a dělá tak webové stránky i aplikace esteticky zajímavější.

React byl oficiálně představen v roce 2013 Facebookem. Facebook tím řešil vlastní problém nedostatků technologií pro vývoj jeho frontend rozhraní nejrůznějších aplikací. Ihned si získal velikou oblibu pro svůj novátorský přístup, jednoduchost a rychlost.

V Rascasone používáme React od roku 2016 a do produkce jsme nasadili již několik React webů a React aplikací. Toto o frameworku říká náš React a JavaScript programátor Dominik:

“React je víc framework než pouhá knihovna, protože nabízí daleko víc než knihovny obvykle nabízí a pomáhá strukturovat celý projekt v daném formátu. Na rozdíl od podobných JavaScript frameworků není React typu MVC - Model-View-Controller, ale spíše pouze V, tedy view framework, ale M-model a C-controller se dají do aplikace doplnit dle potřeby pomocí dalších JavaScript knihoven.”

Na React je často nazíráno jako na moderní, rychle se rozvíjející projekt, který umožňuje tvořit lepší weby a přívětivější uživatelská rozhraní. Architektura této technologie navíc šetří spoustu programátorského času a s tím i krátí čas potřebný k vývoji. Proto je také častou volbou vývojářů i firem.

Proč zvolit React.js z pohledu vývojáře?

1. Syntaxe Reactu je jednoduchá. Dobře se čte i píše.
2. React je webová technologie, umožňuje tedy přímo v kódu používat HTML tagy, které práci značně ulehčují.
3. JSX umožnuje programátorům vytvářet HTML šablony, k nim přiřazovat funkce a rozhodovat, co má být vyrenderováno.
4. V Reactu se používá one-way data flow. Tedy data se předávají jedním směrem z komponenty na komponentu. Každá komponenta je překreslena na základě nového stavu těchto dat.
5. Každá viditelná komponenta webu vždy reprezentuje daný a aktuální stav svých dat. Tento jednoduchý způsob umožňuje implementovat rozsáhlé a složité webové stránky.
6. Umožnuje rozdělení do komponent. Tedy celá webová stránka se rozpadne na menší komponenty. Tím způsobem dojde k dekompozici, která není už tak náročná k řešení. Umožňuje také lepší sdílení kódu a komponent.
7. Oproti JavaScript frameworkům Angular.js nebo Ember.js, což jsou rozsáhlejší webové frameworky, má React větší počet knihoven, kterými lze aplikaci doplnit dle aktuální potřeby.

Náš kolega Dominik opět shrnuje svoje zkušenosti:

“React je velmi lehký, chcete-li odlehčený, framework a také velmi rychlý. Protože se naplno stará pouze o pohledy komponent, není zde taková duplikace dalšího kódu, jako tomu je u dalších hlavních JavaScript frameworků. Je to tedy pouze jakési jádro a použití a rozšíření tohoto jádra je zcela na vás a ve vaší moci. Můžete jít s davem a použít Redux pro správu stavů nebo můžete použít knihovnu MobX, případně jinou alternativu. Cokoliv vyhovuje vám a vašemu případu použití.”

Porovnání Reactu s Vue.js a Angular

Porovnání s dalšímu populárními JavaScript frameworky nevypadá pro React vůbec špatně. V oblibě aktuálně vede před svými konkurenty.

Proč zvolit React z pohledu firmy?

React je rychlým a efektivním prostředkem pro vytváření MVP (Minimal Viable Product) - produkt zvládnete na trh uvést rychleji, než s užitím jiných frontendových frameworků. Druhým důvodem, proč řadu firem tvorba React webu nebo aplikace zajímá, je možnost realizace složitějších uživatelských rozhraní nebo prvků, které mají více událostí, zdrojů či datových modelů.

Tvorba webů v Reactu má mnoho dlouhodobých výhod. React kód je:

• snadněji udržovatelný,
• snadněji testovatelný,
• funkce a chování React aplikace jsou lépe předvídatelné.

React a single-page aplikace

Kromě rozsáhlých komplexních portálů nebo aplikací se React hodí i na tzv. single-page aplikace (SPA). Umožňuje totiž webové stránce překreslovat jednotlivé části, komponenty, v reálném čase bez nutnosti refreshe nebo reloadu obrazovky. Toho právě využívají společnost jako Facebook, AirBnB, Udemy nebo Uber.

Psaní kódu v Reactu je prostě zábavnější a efektivnější. Můžete psát méně a udělat více. K tomu máte dostatek svobody si zvolit vlastní cestu a vlastní architekturu projektu.

Kdy k tvorbě webu, nebo webové aplikace zvolit React?

React má masivní podporu od programátorů, kteří se neustále starají o jeho vývoj. To je dobré znamení, které nasvědčuje tomu, že tu React bude ještě velmi dlouho. Od svého uvedení zaznamenal obrovský posun a přidal vývojářům mnoho nových možnosti.

React můžete použít v podstatě na cokoliv, co jste někde na nějakých webových stránkách viděli. Jen je to trochu jiný způsob jak psát HTML, CSS a JavaScript. V Rascasone jsme v React.js naprogramovali již několik projektů. Například Esticom pro správu a management stavebních prací v digitálním světě.

Dále hotelový online systém pro správu wifi sítí. A posledním příkladem může být aplikace Pinstriped pro online správu schůzek a přípravu na ně. Také experimentujeme s knihovnami z React ekosystému, obzvlášť pak s knihovnami pro kontrolu stavů a SPA routery.

React můžete použít například pro tyto komponenty:

• uživatelské přehledy tzv. dashboardy,
• formuláře a vstupy,
• validace hodnot,
• tabulky a seznamy,
• nejrůznější výpočty,
• grafy,
• grafické prvky a animace,
• jakékoli další složitější webové komponenty.

Pokud máte o vývoj webu, nebo aplikace v Reactu zájem, tak nás neváhejte kontaktovat. Rádi s vámi probereme celý koncept a navrhneme pro vás tu nejvhodnější architekturu, propracovanou funkcionalitu i elegantní design.