Lekce 8 - Kalkulačka v React - Utility funkce a stavy

V minulé lekci, Kalkulačka v React - Tvorba komponent, jsme si postupně vytvořili komponenty pro zadání čísla, vypsání výsledku a pro formulář kalkulačky.

V React tutoriálu definujeme stavy naší aplikace pomocí React hook useState(). Dostaneme se také k utility funkcím.

Poločas – Rekapitulace

Jelikož tvorba aplikací v React je komplexní a jsme asi v polovině, pojďme si ještě před dnešní lekcí udělat malou rekapitulaci. Znalosti se nám tak lépe uloží a zjistíme, že je princip v jádru jednoduchý. Prvně si shrneme, co vše zatím máme připravené:

• Naše aplikace je složená ze samostatných komponent, konkrétně máme:
  • vstupní pole na čísla,
  • výstupní element na výsledek,
  • výběr operace (komponentu Select jsme naimportovali již připravenou z Reactu)
  • komponentu s kalkulačkou, obsahující komponenty výše
  • komponentu aplikace, obsahující komponentu s kalkulačkou
• Komponenty načítají vstupní data z HTML struktury a tato data zobrazují nebo předávají jako vstup dalším komponentám

V aplikaci nám ještě chybí:

• Implementovat logiku výpočtu
• Definovat stavy a tak hodnoty v komponentách měnit
• Reagovat na události a tak kalkulačku zprovoznit

...konec náhledu článku...
Pokračuj dál