Odebírat podcast.

Jaké frameworky vám při vývoji aplikací ušetří čas i peníze?

Vývoj webových nebo mobilních aplikací je časově náročný proces náchylný na mnohé chyby. Existují však frontend frameworky, jejichž praktické využití vám může ušetřit mnohdy až dvě třetiny vývojářské práce a předejít mnoha chybám. V dalším podcastu jsme se zaměřili hlavně na framework React. Příjemný poslech nebo čtení.

Buďte vždy o krok před konkurencí, získejte přístup k plné verzi podcastu i k celé sérii. Přihlaste se k odběru našeho newsletteru.

O čem bylo nové technologické okénko?

Tentokrát si v novém technologickém okénku povídal CEO Pixape Radek Semančík a programátor Vojtěch Seidler o tom, jaké výhody přináší využití určitého frontend frameworku. Nejvíc se pak věnovali frameworku React.

Jaké existují frameworky?

Nejzásadnější javascriptové frameworky jsou tři: Vue.js, Angluar od společnosti GoogleReact od společnosti Meta. Poslední zmiňovaný je však nejrozšířenější. Stojí za ním silná vývojářská komunita, díky čemuž se neustále vyvíjí.

React má přesah do vývoje mobilních aplikací

React skýtá výhodu zejména pro firmy, které potřebují vyvíjet aplikaci zároveň pro několik platforem. Je zde totiž React Native, pomocí něhož lze vytvářet nativní aplikace zároveň pro Android, iOSUWP (Windows). Proto ho ostatně využíváme i v Pixape. Již dříve jsme o výhodách tohoto hybridního vývoje aplikací psali. Díky čemu to React Native zvládá?

Jak React Native umožňuje vyvíjet aplikace hned pro tři systémy najednou?

React vyvíjí za pomoci komponent, které vytváříte a které následně používáte v různých částech aplikace. React Nativ pak tyto komponenty dokáže kompilovat do nativního jazyka různých zařízení (Androind, Apple, Windows).

Každá z těchto komponent má samozřejmě stejné závislosti, stejné property a stejný vnitřní state, ale jejich funkcionalitu React Native převádí přes tzv. bridge do nativních jazyků daného zařízení (Swift od Apple, Java od Androidu, C# u UWP). Díky tomu máme v jednom kódu napsanou aplikaci pro všechna ta zařízení.

Buďte vždy o krok před konkurencí, získejte přístup k plné verzi podcastu i k celé sérii. Přihlaste se k odběru našeho newsletteru.

React Native přináší až 2/3 úspory času i financí

Pokud programujete pouze jeden kód pro tři různé zařízení, přináší to mnoho výhod. Jaké jsou?

React zrychluje single page webových aplikací

Pokud však nevyužijete psaní jednoho kódu pro tři platformy, je tu ještě další výhoda? Ano! React je dost často využíván pro zrychlení single page webových aplikací. Když totiž normálně překlikáváte mezi různými podstránkami jedné stránky, vždy se znovu načítá celá stránka (javascripty, css soubory, styly apod.). React však umí zařídit, aby se nerenderovala znovu celá stránka, ale vždy jen její určitý blok, který má být pozměněný oproti předcházející stránce.

React k tomu používá komponenty, které jsou virtuální objekty, tzn. virtual dom. Tyto virtual dom pak umí udržovat stav určitého bloku, určité části aplikace. Co to znamená? Když máte třeba nějaký side bar, kde je banner s reklamou, dřív se pro změnu jeho obsahu musela znovu vykreslit celá stránka. Pomocí virtual dom však dokážete velice rychle a dynamicky překreslit jen ten konkrétní prvek na té dané stránce. Webová stránka je tedy mnohem rychlejší.

React přináší přehlednost a rychlost vývoje

V Reactu píšete v programovacím jazyce JSX, což má další velkou výhodu. Díky tomu můžete psát javascriptový a html kód v jednom souboru. Je to přehledné, rychlé a pružné pro vývoj a pro zorientování se, co má konkrétní část toho kódu dělat.

Jak už pak bylo zmíněno, kód se zde dělí na komponenty, z nichž každá má nějakou funkci. Můžete si např. vytvořit komponentu na formulář, kterou pak můžete užít v různých částech aplikace. Šetříte tím nejen čas, ale také zamezíte skrytým chybám, které mohou nastat při duplicitě kódu na různých místech aplikace.

 

Práci usnadňuje i rozsáhlá komunita kolem Reactu. Díky ní je totiž připraveno spoustu balíčků třetích stran, které usnadňují práci. Mnoho funkcí díky tomu nemusíte psát od začátku. Jednoduše si je stáhnete a zanoříte do vyvíjené aplikace, popř. je částečně poupravíte. Sem patří třeba i React router, který zpracovává již zmíněné přepínání stránek mezi sebou při využití single page aplikace.

TypeScript ulehčuje změny aplikace i jejich kontrolu

Poslední věc, která ve spojitosti s Reactem přináší velké výhody, je TypeScript. Ale od začátku. Pokud něco v aplikaci stahujete z nějakého serveru, backendu, apíčka, tak se vám vrátí odpověď v nějakém formátu a v nějaké struktuře. V různých částech aplikace tuto odpověď pak využíváte. Problém však nastává, když užíváte JSX a rozhodnete se, že chcete nějakou proměnou v tom zdroji přejmenovat. Tehdy musíte vědět nebo složitě vyhledávat, kde všude tu konkrétní proměnou máte. Jde to však i jednodušeji. K tomu slouží TypeScript.

Buďte vždy o krok před konkurencí, získejte přístup k plné verzi podcastu i k celé sérii. Přihlaste se k odběru našeho newsletteru.

TypeScript je nástavba JSX, která využívá datové typy. Za jejich pomocí řeknete, v jaké struktuře počítáte s daným zdrojovým objektem, jakou má mít strukturu a jaké má mít uvnitř datové typy. Pokud pak změníte datový typ nebo název té proměnné a použili jste ho ještě někde jinde, kde to není změněno, budete na to ihned upozorněni. Odhalí se tedy spoustu chyb, které mohou nastat během refactoringu nebo vývoji mobilních aplikací.

TypeScript má i další využití. Vývoj jde neustále kupředu, vše se zrychluje a jsou neustále nové aktualizace. Když poté použijete k vývoji knihovny od třetích stran a užíváte pouze JSX, nemusíte při sestavování aplikace vůbec zjistit, že třetí strany danou knihovnu aktualizovaly a že jsou zde najednou jiné parametry. To by se projevilo až u klienta. Aplikace by se stala nefunkční. TypeScript tohle ale rozpozná a ihned to nahlásí.

React je cestou k levnější, rychlejší a bezchybnější aplikaci

Jak jste si tedy mohli přečíst, námi preferovaný framework React vám umožní programovat pro několik platforem najednou a dovolí vám využít již naprogramované funkce nebo knihovny. S pomocí TypeScriptu se pak React postará také o menší chybovost vašich aplikací.

Chcete vědět více o Reactu nebo máte jakékoliv další otázky? Ozvěte se nám.

Buďte vždy o krok před konkurencí

Odebírejte naše podcasty a objevte, proč nejčastěji aplikace neuspějí a jak tomu zabránit. Naservírujeme vám nejnovější přístupy i technologie, díky kterým budou vaše aplikace oblíbenější, ziskovější a budete s nimi mít méně starostí. Sledujte nás a uspějte na poli aplikací.


Buďte vždy o krok před konkurencí

Odebírejte naše podcasty a objevte, proč nejčastěji aplikace neuspějí a jak tomu zabránit. Naservírujeme vám nejnovější přístupy i technologie, díky kterým budou vaše aplikace oblíbenější, ziskovější a budete s nimi mít méně starostí. Sledujte nás a uspějte na poli aplikací.