Layout-Komponenten Struktur für Ihre Oberfläche

Wie organisiert man Oberflächeninhalte logisch und modular?

  • Einführung in Layout-Komponenten
  • Split-Screen-Layout: Konzepte und Verbesserungen
  • Listen- und Item-Komponenten
  • Modale Dialoge als Layout-Elemente
Container-Komponenten Trennung von Logik und Darstellung

Wie trennt man Präsentation von Geschäftslogik?

  • Bedeutung und Nutzen von Container-Komponenten
  • Serverkommunikation und Datenbeschaffung
  • Komponenten wie CurrentUserLoader, UserLoader, ResourceLoader, DataLoader
Controlled vs. Uncontrolled Components Kontrolle in der Formularwelt

Wer steuert den Zustand das DOM oder React?

  • Unterschiede, Vor- und Nachteile
  • Uncontrolled Forms: Einfach, aber begrenzt
  • Controlled Forms: Präzise und kontrolliert
  • Modale Dialoge und Onboarding-Flows im Vergleich
Higher-Order Components (HOCs) Funktionalität durch Komposition

Wie fügt man Komponenten neue Fähigkeiten hinzu ohne sie zu verändern?

  • Grundprinzip von HOCs
  • Props-Manipulation und Datenladen per HOC
  • JSX-Erweiterung mit HOCs
Custom Hooks Logik elegant auslagern

Wie schafft man wiederverwendbare Logik mit Hooks?

  • Einführung in eigene Hooks
  • Beispiele: useCurrentUser, useUser, useResource, useDataSource
  • Best Practices für Hook-Design
Funktionale Programmierung in React Denken in Kompositionen

Was passiert, wenn React auf funktionale Prinzipien trifft?

  • Grundlagen der funktionalen Programmierung
  • Rekursive Komponenten
  • Komposition von Komponenten

Lernziele

  • Sie verstehen die Rolle und Vorteile gängiger React-Entwurfsmuster.
  • Sie wenden Layout- und Container-Komponenten gezielt zur Strukturierung Ihrer Anwendung an.
  • Sie nutzen Controlled Components effektiv zur zuverlässigen Zustandsverwaltung.
  • Sie beherrschen fortgeschrittene Konzepte wie Higher-Order Components und Custom Hooks.
  • Sie integrieren funktionale Programmierprinzipien zur sauberen Komposition Ihrer UI.
Zielgruppe
  • Frontend-Entwickler:innen mit React-Grundkenntnissen, die ihre Architekturkenntnisse vertiefen und auf ein professionelles Niveau heben möchten. Ideal für Entwickler:innen in Teams, Agenturen oder größeren Projekten.

Am Ende dieses Seminars sind Sie in der Lage, robuste und wartbare React-Anwendungen zu entwerfen, die auf professionellen Entwurfsmustern basieren. Sie gewinnen nicht nur theoretisches Verständnis, sondern auch sofort einsetzbares Wissen für Ihre Praxisprojekte.


(Version: 2026-02-13T10:43:51+01:00)