React für Fortgeschrittene: Daten, State und KI-Assistenten
Effizientes Arbeiten mit serverseitigen Daten und Transitionen
- Passende Werkzeuge für Statemanagement
- KI-Assistenten in die eigene Oberfläche einbauen
In diesem Workshop sehen wir uns an, was React-Entwicklung ausmacht, wenn es über die React-eigenen APIs hinausgeht. Dazu bauen wir eine durchgehende Anwendung, die viele typische Anforderungen erfüllen soll. Dabei lernst Du, wie du serverseitige Daten effizient lädst, cachst und schreibst, und wie du mit Suspense und Transitions steuerst, wie sich die Oberfläche verhält, solange Daten geladen werden. Wir klären, welche Art von Zustand an welchen Ort gehört (z.B. State, URL, Context, Store) und bauen typsichere Formulare mit Validierung. Außerdem bauen wir gemeinsam einen KI-Assistenten in die Anwendung ein, der nicht nur Fragen beantworten kann, sondern die Oberfläche selbst bedient, um Use-Cases eigenständig auszuführen.
Serverseitige Daten und Ladeverhalten
- Alternativen zu useEffect und fetch
- TanStack Query: Caching, Invalidierung, optimistic Updates
- Suspense als flexible Ladegrenze
- Transitions für elegante UI-Übergänge
- Request-Wasserfälle erkennen und beheben
Zustand und Formulare
- React Context zur Kommunikation zwischen Komponenten
- Stores für verteilten Anwendungszustand
- Typsichere Formulare
- Zod zur Validierung
- Rendern optimieren mit dem React Compiler
KI-Assistenten in der Oberfläche
- Warum sich ein Agent anders verhält als ein klassisches API
- AG-UI als offenes Protokoll, Abgrenzung zu MCP und A2A
- Streaming-Chat mit TanStack AI
- Client- und serverseitige Tools für den Agenten
- Freigaben und Rückfragen an den Menschen
Dieser Workshop richtet sich an Entwickelnde von React-Anwendungen.
Du solltest grundlegende React- und TypeScript-Kenntnisse mitbringen. Vorkenntnisse zu KI oder Sprachmodellen sind nicht nötig.
Mindestanzahl Teilnehmende: 3 Personen