Merge branch 'master' into FJ-reseni-React-2-3

Czechitas-podklady-WEB · May 12, 2024 · 1305c93 · 1305c93
2 parents f61e493 + 0fe3728
commit 1305c93
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 0 deletions.
diff --git a/daweb/react/pokrocila-komunikace/cvlekce/dotaznik-fajfka.md b/daweb/react/pokrocila-komunikace/cvlekce/dotaznik-fajfka.md
@@ -13,3 +13,7 @@ V našem dotazníku budeme chtít zařídit, že po kliknutí na jednu z 5 možn
 1. Zařiďte následující: pokud je ve stavu `answered` hodnota `false`, chceme, aby componenta `QuestionBody` měla ikonku `symbolQuestion`. Pokud je stav `true`, chceme, aby typ ikonky byl `symbolTick`.
 1. Nyní chceme komponentě `Option` přidat callback, pomocí kterého může informovat svého rodiče, že otázka byla zodpovězena. Přidejte tedy komponentě `Option` prop s názvem `onSelected`. V této prop očekáváme funkci. Zařiďte, aby komponenta `Option` zavolala funkci `onSelected` ve chvíli, kdy na tuto komponentu klikneme.
 1. V komponentě `Question` si vytvořte funkci `handleSelect`. Všem komponentám `Option` pak skrze prop `onSelected` tuto funkci předejte. Funkce `handleSelect` nechť nastaví stav `answered` na hodnotu `true`. Takto zajístíme, že kdykoliv uživatel klikne na nějakou možnost, stav se nám nastaví na `true` a tím se změní ikonka v těle otázky na fajfku.
+
+:::solution
+Řešení je v repository cvičení v branchi reseni v commitu [2e6c78d](https://github.com/Czechitas-podklady-WEB/cviceni-dotaznik/tree/2e6c78df178fe9a0ad960d2be1e04f2bca7e0c09).
+:::
diff --git a/daweb/react/pokrocila-komunikace/cvlekce/dotaznik-odpoved.md b/daweb/react/pokrocila-komunikace/cvlekce/dotaznik-odpoved.md
@@ -14,3 +14,7 @@ Pokračujme v příkladu z předchozího cvičení. Nyní budeme chtít místo f
 1. Funkce `handleSelect` v komponentě `Question` bude pak mít jeden parametr, který nazveme `iconType`. Jakmile se tato funkce zavolá, nastavíme náš stav `answer` na hodnotu získanou v tomto parametru.
 
 Tímto jsem zařídili, že komponenta `Option` předá svému sourozenci `QuestionBody` informaci o tom, kterou ikonku uživatel vybral.
+
+:::solution
+Řešení je v repository cvičení v branchi [reseni](https://github.com/Czechitas-podklady-WEB/cviceni-dotaznik/tree/reseni).
+:::
diff --git a/daweb/react/pokrocila-komunikace/cvlekce/dotaznik.md b/daweb/react/pokrocila-komunikace/cvlekce/dotaznik.md
@@ -13,3 +13,7 @@ V tomto cvičení začneme vytvářet jednoduchou aplikaci na tvorbu dotazníků
 1. Prohlédněte si vzhled aplikace a také její zdrojový kód. Nejsme už žádní troškaři, aplikace se skládá hned z pěti oddělených komponent. Prohlédněte si, jak jsou navzájem propojené a seznamte se s celkovou strukturou aplikace. Komponentu `Icon` zatím nezkoumejte. Je v ní trochu pokročilejší kód pro zobrazování ikonek.
 1. Prohlédněte si komponentu `Option`. Přepište ji tak, aby používala destrukturování props.
 1. Totéž proveďte s komponentami `Question` a `QuestionBody`.
+
+:::solution
+Řešení je v repository cvičení v branchi reseni v commitu [230b48c](https://github.com/Czechitas-podklady-WEB/cviceni-dotaznik/tree/230b48c741a526741d0e7937915f532f0b07be5a).
+:::
diff --git a/daweb/react/pokrocila-komunikace/cvlekce/hamburger-menu.md b/daweb/react/pokrocila-komunikace/cvlekce/hamburger-menu.md
@@ -13,3 +13,7 @@ Pomocí pokročilejší komunikace mezi komponentami zprovozníme hamburger menu
 1. Dle hodnoty ve stavu `menuOpened` správně sestavte třídu pro element `.menu`. K zavření menu slouží CSS třída `menu--closed`.
 1. Chceme, aby komponenta `MenuItem` přijímala prop s názvem `onSelect`. Ta bude očekávat callback, který se zavolá, když uživatel vybere danou položku, aby se tak menu zavřelo. Přidejte tedy na prvek `<a>` posluchač události `onClick`, který zavolá předaný callback.
 1. V komponentě `HomePage` předejte všem instancím komponenty `MenuItem` skrze _prop_ `onSelect` funkci `handleSelectItem`, která nastaví stav `menuOpened` na `false`.
+
+:::solution
+Řešení je v repository cvičení v branchi reseni v commitu [b51a03e](https://github.com/Czechitas-podklady-WEB/cviceni-hamburger/tree/b51a03e9b874ee00c1507b6884ca4fbcaa6c47f9).
+:::
diff --git a/daweb/react/pokrocila-komunikace/cvlekce/komunikace.md b/daweb/react/pokrocila-komunikace/cvlekce/komunikace.md
@@ -8,3 +8,7 @@ solutionAccess: protected
 
 1. Vytvořte si repozitář ze šablony [cviceni-pokrocila-komunikace](https://github.com/Czechitas-podklady-WEB/cviceni-pokrocila-komunikace).
 1. Následujte instrukce z README repozitáře.
+
+:::solution
+Řešení je v repository cvičení v branchi [reseni](https://github.com/Czechitas-podklady-WEB/cviceni-pokrocila-komunikace/tree/reseni).
+:::
diff --git a/daweb/react/pokrocila-komunikace/cvlekce/nazev-stranky.md b/daweb/react/pokrocila-komunikace/cvlekce/nazev-stranky.md
@@ -11,3 +11,7 @@ Pokračujte v předchozím příkladu. Nyní si vyzkoušíme callback s parametr
 1. Přidejte do komponenty `HomaPage` stav s názvem `pageTitle`, který bude představovat název aktuální stránky. Jeho výchozí hodnotu nastavte na `Domů` a použijte tento stav uvnitř elementu `h1`.
 1. Zařiďte, aby komponenta `MenuItem` při volání funkce `onSelect` zavolala tuto funkci se vstupem, který udává název stránky, který se má zobrazit. Takto předá název stránky rodičovské komponentě.
 1. Do funkce `handleSelectItem` přidejte parametr `page` a nastavte stav `pageTitle` na hodnotu z tohoto parametru.
+
+:::solution
+Řešení je v repository cvičení v branchi [reseni](https://github.com/Czechitas-podklady-WEB/cviceni-hamburger/tree/reseni).
+:::