Shrnutí

V této lekci jste se naučili, že:

• React vytváří stránku z vašich dat. Popíšete, co má stránka ukazovat, a když se data změní, React stránku sám aktualizuje, bez querySelector() a textContent.
• Aplikace v Reactu má index.html s prázdným <div id="root">, main.jsx, který v něm ukáže <App /> a je ve všech cvičeních stejný, a App.jsx, ve kterém pracujete.
• Komponenta je funkce, jejíž název začíná velkým písmenem a která vrací JSX, tedy tagy napsané přímo v kódu. export default function App() dovolí souboru main.jsx importovat App.
• JSX na víc řádků patří za return do závorek a celé do jednoho prvku, třeba do main.
• Komponentu použijete jako tag, <Uvitani />, tolikrát, kolikrát potřebujete. Název s malým písmenem, třeba <uvitani />, je tag z HTML, ne vaše komponenta.
• Chyba v zápisu kódu se ukáže červeně pod náhledem i se souborem, řádkem a sloupcem a aplikace se nespustí. Chyby za běhu aplikace a varování Reactu ukazuje konzole.

V další lekci, JSX, se podíváte blíž na tagy ve vašich komponentách: v čem se liší od HTML a jak do nich dostat hodnoty z kódu.

Nejdřív si ale vše procvičte na stránce s festivalovými vstupenkami. App.jsx má zatím jen nadpis a dvě komponenty k němu napíšete sami.