diff --git a/05_react/agenda.md b/05_react/agenda.md index e1b5b41..fcfb026 100644 --- a/05_react/agenda.md +++ b/05_react/agenda.md @@ -566,7 +566,7 @@ Projektarbeit **Übungen:** -Übung 01 - 5 +Übung 01 - 03 --- @@ -581,7 +581,7 @@ Projektarbeit **Übungen:** -Übung 08 - 11 +Übung 04 - 07 --- @@ -596,7 +596,7 @@ Projektarbeit **Übungen:** offene Übungen. -Übung 12 - 14 +Übung 08 - 11 --- @@ -604,12 +604,84 @@ offene Übungen. **Inhalt:** +- Einführung in Hooks in React. +- Hooks in React. `useState`. + +**Übungen:** + +Übung 12 - 13 + +--- + + +--- + +### Tag 41 + +**Inhalt:** + - Hooks in React. `useState`, `useReducer`, `useContext`, `useId`. - Routing in React - Verschachtelte Routen und Layout-Komponenten **Übungen:** -Übung 15 +Übung 14 - 15 + +--- + +### Tag 42 + +**Inhalt:** + +- Verschachtelte Routen und Layout-Komponenten +- Formulare in React +- Validierung classic + +**Übungen:** + +Übung 16 - 18 + +--- + +### Tag 43 + +**Inhalt:** + +- Validierung mit `react-hook-form` und Schema Objekten +- Hook: `useEffect`. Arbeiten mit asynchronen Daten. +- Asynchron arbeiten mit axios/ fetch + +**Übungen:** + +Übung 19 + +--- + +### Tag 44 + +**Inhalt:** + +- Aktualisierung von Node +- Testing in React +- Mocking mit async Data +- Weitere Techniken: Snapshot & Cypress + +**Übungen:** + +Übung 20 + +--- + +### Tag 45 + +**Inhalt:** + +- Typische Fehlermeldungen: Syntaxfehler, Referenzfehler, TypeError +- Einrichtung von TS +- Logische Fehler + +**Übungen:** +Projektarbeit --- diff --git a/05_react/unterricht/tag40/04_components-with-hooks/src/App.jsx b/05_react/unterricht/tag40/04_components-with-hooks/src/App.jsx index 228e0ba..95db212 100644 --- a/05_react/unterricht/tag40/04_components-with-hooks/src/App.jsx +++ b/05_react/unterricht/tag40/04_components-with-hooks/src/App.jsx @@ -5,6 +5,7 @@ // import FormNewsletter from './components/forms/FormNewsletter'; import ExampleUseState from './components/examples/ExampleUseState'; +import InputAmount from './components/inputs/InputAmount'; function App(props) { // const { } = props; @@ -28,6 +29,8 @@ function App(props) {