Lekce 12 - Ekosystém Reactu - TypeScript
V předchozí lekci, Client-side routing, jsme si ukázali client-side routing v Reactu pomocí knihovny React Router.
V následujícím tutoriálu pokročilého Reactu se budeme zabývat kontrolou datových typů s využitím TypeScriptu. Ukážeme si, jak TypeScript využít pro efektivní definování typů v React komponentách, správu stavu a předávání props.
TypeScript
TypeScript je nadstavbou JavaScriptu. Rozšiřuje ho o statické typování, třídy, rozhraní a další věci známé z OOP. Podrobné informace máme v kurzu TypeScript.
Použití TypeScriptu v Reactu si ukážeme na aplikaci Task Manager.
Založení projektu Task Manager
V pracovní složce si otevřeme terminál a spustíme příkaz pro
vytvoření aplikace. Pokud se rozhodneme použít interaktivní konfiguraci,
tak jako programovací jazyk zvolíme TypeScript namísto JavaScriptu. V
případě přímého zadání parametrů zvolíme šablonu
react-ts namísto react:
Vytvoření aplikace:
npm create vite task_manager -- --template react-ts
Vytvořila se nám složka task_manager/. Přesuneme se do ní,
nainstalujeme závislosti a projekt spustíme na lokálním serveru:
Spuštění projektu: cd task_manager npm install npm run dev
Po vytvoření projektu Task Manager a nastavení TypeScriptu je na první
pohled vidět, že soubory mají koncovku .tsx místo obvyklé
.ts. Tato změna umožňuje použití syntaxe JSX i v TypeScriptu.
V IDE si otevřeme soubor src/App.tsx a uvidíme standardní obsah
React aplikace:
...konec náhledu článku...
Pokračuj dál
Došel jsi až sem a to je super! Věříme, že ti první lekce ukázaly něco nového a užitečného.
Chceš v kurzu pokračovat? Přejdi do prémiové sekce.
roční PŘEDPLATNÉ
1 082 Kč
měsíčně, placeno ročně (12 984 Kč)14 000+ lekcí, cvičení a testů
6 000+ ti zůstane napořád
Neomezený přístup ke všem aktuálním
i připravovaným kurzům.
Koupit pouze tento kurz
Získej okamžitý přístup ke kurzu bez
časového omezení.
600 Kč
Před koupí tohoto článku je třeba koupit předchozí díl
Obsah článku spadá pod licenci Premium, koupí článku souhlasíš s Provozními podmínkami.
- Přístup k jednotlivým lekcím dle způsobu pořízení.
- Kvalitní znalosti v oblasti IT.
- Dovednosti, které ti pomohou získat vysněnou a dobře placenou práci.
Popis článku
Požadovaný článek má následující obsah:
V tutoriálu pokročilého Reactu se naučíme používat TypeScript. Tím zajistíme především kontrolu datových typů.
