11. diel - Debugovanie React Native aplikácií
V minulej lekcii, Aplikácia ToDo - Navigácia a dokončenie , sme vytvorili vzhľad našej aplikácie a naučili sa pracovať s navigáciou.
V nasledujúcom tutoriále vývoja multiplatformných mobilných aplikácií v React Native sa zameriame na debugovanie aplikácie pomocou Chrome DevTools, React DevTools a neminie nás ani debugovanie priamo vo Visual Studio Code.
Debugovanie s Chrome DevTools
Rovnako ako pri webových stránkach pomocou Chrome DevTools (slovensky sa im hovorí Vývojárske nástroje) získavame prehľad o JavaScript kóde aplikácie. S týmto nástrojom máme prístup ku kartám ako je Console, Source či Network. Chrome DevTools máme k dispozícii v akejkoľvek aplikácii využívajúcej Hermes (JavaScript engine optimalizovaný pre React Native). Nástroje otvoríme kliknutím pravým tlačidlom myši na stránku a výberom možnosti Preskúmať (Inspect), či Revízia prvku. Rôzne prehliadače to bohužiaľ majú pomenované každý inak. Obvykle sa ale držia rovnaké klávesové skratky. Klávesová skratka je na Windows Ctrl + Shift + I a na MacOS Command + Option + I. Na debugging si založíme samostatný projekt. V pracovnej zložke otvoríme terminál a vytvoríme novú aplikáciu Debugging a spustíme ju:
Bežiacu aplikáciu v
termináli ponecháme pred voľbou Expo go
. Presunieme sa do IDE,
kde otvoríme zložku aplikácie Debugging/
a otvoríme súbor
App.js
. Na ukážku debuggingu použijeme nasledujúci kód,
ktorým nahradíme kód v App.js
:
...koniec náhľadu článku...
Pokračuj ďalej
Minul si až sem a to je super! Veríme, že ti prvé lekcie ukázali niečo nového a užitočného.
Chceš v kurze pokračovať? Prejdi do prémiové sekcie.
Kúpiť tento kurz
Obsah článku spadá pod licenciu Premium, kúpou článku súhlasíš so zmluvnými podmienkami.
- Neobmedzený a trvalý prístup k jednotlivým lekciím.
- Kvalitné znalosti v oblasti IT.
- Zručnosti, ktoré ti pomôžu získať vysnívanú a dobre platenú prácu.
Popis článku
Požadovaný článok má nasledujúci obsah:
V tutoriále React Native sa naučíme debugovať aplikáciu pomocou Chrome DevTools, React DevTools ale aj priamo vo Visual Studio Code.
Kredity získaš, keď podporíš našu sieť. To môžeš urobiť buď zaslaním symbolickej sumy na podporu prevádzky alebo pridaním obsahu na sieť.