Lekce 9 - Stylování kalkulačky pomocí Material UI
V předchozí lekci, Základy stylování aplikace pomocí Material UI v Reactu, jsme se dozvěděli, jak přidat aplikaci v
Reactu styly pomocí knihovny Material UI a seznámili jsme se s komponentami
Container, Grid, Typography a
Button.
V dnešním tutoriálu pokročilého Reactu aplikujeme získané znalosti stylování pomocí knihovny Material UI na přidání stylů do aplikace kalkulačky. Využijeme k tomu kód kalkulačky vytvořené v kurzu Základy Reactu. Srovnání původní a nastylované kalkulačky bude vypadat takto:
Potřebné instalace a spuštění projektu
Jako základ projektu použijeme kalkulačku, kterou si stáhneme v lekci kurzu Základy Reactu s názvem Kalkulačka v React - Události a dokončení. Stáhnutý kód rozbalíme do pracovní složky. V preferovaném editoru kódu a v terminálu si spustíme příkazy pro instalaci potřebných modulů, knihovny Material UI a jejího balíčku ikon a projekt nakonec spustíme na lokálním serveru:
...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.
Koupit tento kurz
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íš se smluvními podmínkami.
- Neomezený a trvalý přístup k jednotlivým lekcím.
- 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 si ukážeme základy stylování pomocí knihovny Material UI na konkrétním příkladu stylování kalkulačky.
Kredity získáš, když podpoříš naši síť. To můžeš udělat buď zasláním symbolické částky na podporu provozu nebo přidáním obsahu na síť.
