Lekce 8 - Základy stylování aplikace pomocí Material UI v Reactu
V předchozí lekci, Hooky v Reactu - useContext() a useReducer(), jsme si představili hooky
useContext()
a useReducer()
a ukázali jsme si, jakou
mají sílu při společném použití.
V následujícím tutoriálu pokročilého Reactu si
ukážeme základy stylování pomocí knihovny Material UI. Seznámíme se
také se základními komponentami Container
, Grid
,
Typography
a Button
, které knihovna nabízí.
Knihovna Material UI
Aby aplikace v Reactu vypadaly reprezentativně, přidáváme do nich různé styly. Existují knihovny komponent, které toto stylování usnadňují. Jednou z nich je také Material UI. Knihovna implementuje do světa webových aplikací principy Material Designu od společnosti Google.
Její výhodou jsou předdefinované komponenty pro zajištění jednotného vzhledu, jednoduchost stylování a také pomoc s tvorbou responzivního designu. Velkým plusem je kvalitní dokumentace a aktivní komunita uživatelů, kteří sdílí své znalosti a zkušenosti.
Pojďme si tedy vyzkoušet v praxi, co knihovna Material UI umí. Založíme si k tomu novou React aplikaci, do které knihovnu nainstalujeme.
...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 si základy použití knihovny Material UI a její vybrané komponenty Container, Grid, Typography a Button.
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íť.