React Einführung: Grundlagen für Web-Entwickler

Seminarziel

Sie kennen die Vorteile von React und weiteren Komponenten wie Redux, Saga und Reselect. Sie können React-Projekte erstellen und React-Komponenten selbstständig entwickeln. Sie kombinieren React-Komponenten mit Immutable.js sowie Redux und haben das Testen von React kennengelernt.

Inhalt

• React im Überblick
  • Grundprinzipien moderner Frontend Frameworks und Vergleich mit Alternativen
  • deklarative Architektur
  • Komponenten
  • Wie sieht das React-Ökosystem aus?
    
    
• JSX: die React Templatesprache
  • Binden von Inhalten und Props
  • Eventhandler
  • if / else
  • Elemente wiederholen
  • CSS-Klassen und Stile
    
    
• State und deklaratives Rendering
  • Arbeiten mit State und dem State Hook
  • Arbeiten mit State in Klassenkomponenten
  • State Management mit Reducern und dem Reducer Hook
  • Überblick über das Redux-Ökosystem
    
    
• React mit TypeScript
  • TypeScript Grundlagen: Typendeklarationen, Funktionssignaturen, Type Aliases, Generics (jeweils nach Bedarf)
  • Typisierung von Komponenten-Props und -Events mit TypeScript
  • Typisierung von Event-Handlern mit TypeScript
  • Typisierung verschiedener Hooks mit TypeScript
    
    
• Komponenten
  • Einbinden vorgefertigter Komponenten
  • Definieren eigener Komponenten
  • Props und Events in eigenen Komponenten
  • Inspizieren von Komponenten mit den React Developer Tools
    
    
• API-Abfragen und der Effect-Hook
  • Senden von HTTP-Anfragen via fetch oder Axios
  • Auslösen von HTTP-Anfragen mittels des Effect-Hooks
    
    
• Erweiterte Themen im React-Universum
  • Verwendung eines Routers
  • Definieren eigener Hooks
  • Verwenden externer Hooks
  • Context: Bereitstellen von Daten über einen Komponentenbaum hinweg
  • Testing von React-Anwendungen mit Jest