React und Redux

Tag 1

• React Grundlagen
• Was ist React?
• Die Vorteile von React
• Ein Projekt erstellen
• Ordnerstruktur und Komponenten
• Grundlagen JSX


• React-Komponenten
• Funktionskomponenten erstellen
• Arbeiten mit React-Komponenten
• React-Komponenten und Ereignisverarbeitung
• Manipulation von Zuständen
• Weitergabe von Methoden zwischen Komponenten
• Arbeiten mit Listen und Bedingungen
• Bedingtes Rendern von Inhalten


• Styling von React-Komponenten
• Hinzufügen von Styling mit Stylesheets
• Arbeiten mit Inline-Stilen
• Stile und Klassen dynamisch erstellen und nutzen
• Das "Emotion" Paket
• Das "Styled Components" Paket


• React-Komponenten im Detail
• Die Projektstruktur
• Klassenkomponenten vs. Funktionskomponenten
• Die Verwendung von React-Komponenten
• Die Optimierung von Funktionskomponenten


• TypeScript in React
• TypeScript Grundlagen
• Typisierung von Komponenten-Props und -Events
• Typisierung von Event-Handlern
• Typisierung verschiedener Hooks

Tag 2

• Http-Zugriffe
• Http-Anforderungen in React
• Einführung in das Paket "Axios"
• Erstellen und Verarbeiten einer Http-GET-Anfrage
• Daten an den Server "POST"en
• Senden einer DELETE-Anfrage
• Fehlerbehandlung in HTTP-Aufrufen


• Routing
• Routing in "Single Page Application" (SPA)
• Arbeiten mit Paketen
• Einrichten des Routing im Projekt
• Einsatz von Routen


• Formulare
• Formulare und Formular-Validierung
• Formularkomponenten Verwenden
• Validierungs-Feedback hinzufügen
• Fehlermeldungen anzeigen


• React und Redux
• Zustandsverwaltung
• Den Datenfluss verstehen
• Einrichtung und Aktionen definieren
• Das "Immutable-Update-Pattern"
• Arbeiten mit den Paketen "Redux" und "React Redux"
• Hinzufügen von Redux "Middleware"
• Verwenden der "Redux Devtools"
• Ausführen von Asynchronem Code
• Verwenden von "Action Creators"
• Verwenden von "GetState"


• Authentifizierung
• Authentifizierung in einer "Single Page Application" (SPA)
• Authentifizierungsformulare ertellen (Login, Sign-In, Password-Recovery)
• Authentifizierungsservice nutzen
• Ressourcen schützen und automatische Weiterleitung

Tag 3

• Hooks
• Einführung in "Hooks"
• Verwenden von "useState()", "useEffect()", "useCallback()"
• Verwenden von "refs", "useRef()", "useReducer()", "useContext()", "useMemo()"
• Erstellen und Verwenden von "Custom Hooks"


• Testing
• Grundlagen
• Die Werkzeuge
• Tests schreiben
• Modul-Tests
• Komponenten-Tests
• Redux-Tests
• E2E-Tests


• Bereitstellung von Anwendungen
• Grundlagen
• Projekterstellung
• Umsetzung