Blog · 02.02.2024 · 5 Minuten

React-Schulung aus der Praxis

Was im Raum passiert, wenn wir gemeinsam eine App bauen

React-Schulung aus der Praxis

Wer eine React-Schulung buchen will, findet Dauer, Zielgruppe und Inhalte auf der Angebotsseite. Hier geht es um den Tag selbst: zuerst die Basics, dann eine App mit dem Stack, den ihr danach im Projekt wiedererkennt.

Ich gebe die Kurse unter anderem über Cegos Integrata GmbH. In der Runde sitzen häufig Entwicklerinnen und Product Owner von DB Systel. Daneben mache ich Inhouse-Formate, zugeschnitten auf das System, das das Team danach wieder anfasst.

Zuerst die Basics

React erklärt sich nicht über Slides. JSX, Komponenten, Props, State: das muss sitzen, sonst helfen die Libraries nichts. Verstanden ist es erst, wenn eine Komponente bricht, der State sich verdoppelt und jemand aus der Runde sagt: Genau das haben wir im Projekt.

Wir starten mit Vite und TypeScript. Node muss laufen, sonst kommt niemand in den Raum. Dann kleine Aufgaben: Begrüßung mit Props, State am Button, eine Liste, Navigation zwischen zwei Seiten. Jede hat eine Advanced-Variante, wenn es zu schnell geht. TypeScript kommt dabei mit, nicht als Extra-Tag am Ende.

Ein Developer von DB Systel, über Cegos Integrata GmbH: „Kein Folien-Marathon. Wir haben durchgängig geübt, und Fragen aus unserem Arbeitsalltag sind direkt in die Übungen gewandert.“

Die Movie-App, mit dem Stack von heute

Danach bauen wir eine App, mit der Nutzer Filme und Serien verwalten und bewerten. Liste, löschen, anlegen, bewerten, Favoriten, zwei Routen, lokal speichern. Erst wenn die Basics in der App liegen, kommt die echte Welt dazu.

Filme holen wir von The Movie Database. Den Mechanismus zeigt fetch. Damit die App sich anfühlt wie ein aktuelles Projekt, liegt das Laden, Cachen und die Fehlerbehandlung bei TanStack Query. Globalen State, den die API nicht gehört, machen wir mit Redux Toolkit, weil genau das in vielen Bestandsprojekten liegt, und mit Zustand, wo weniger Boilerplate reicht. Tests mit Vitest und React Testing Library. UI mit Material UI. Router in der aktuellen Version, ohne den Umweg über alte APIs.

Hooks üben wir in Kleingruppen: 30 Minuten eine Mini-App, dann vorstellen. Fragen aus dem Job wandern in die Übungen, sobald Props und State sitzen.

Ein Product Owner, ebenfalls DB Systel über Cegos Integrata GmbH: „Dass echte Themen aus der Runde aufgegriffen und gemeinsam gelöst wurden, hat den Unterschied gemacht. Danach konnte ich das im Projekt anwenden.“

Genau dafür sitzen POs mit in der Schulung. Nicht um JSX zu schreiben. Sondern um Aufwand und Machbarkeit einordnen zu können, ohne die Sprache der Entwickler zu raten.

Für wen der Tag taugt

Entwickler mit JavaScript-Basis, die zu React und TypeScript wollen. Leute mit Angular- oder Vue-Hintergrund. Teams, die vor einem gemeinsamen Projekt eine Sprache brauchen. Product Owner, die nicht mitprogrammieren, aber entscheiden müssen.

JavaScript-Grundlagen helfen. TypeScript lernen wir an der App, nicht in einem Theorieblock. Fehlt die JS-Basis, gibt es vorher einen kompakten Crashkurs. Laptop mit aktueller Node-Umgebung reicht.

Dauer: 1 bis 3 Tage, Präsenz oder Live-Online. Preis auf Anfrage. Das steht im Detail auf der React-Schulungsseite. Überblick über Android, Architektur und Produkt unter allen Schulungen.

Danach

Am Ende habt ihr keine Zertifikatsfolie, sondern eine Movie-App, die ihr erklären könnt: Komponenten und State, TypeScript, API über Query, globaler State, Tests. Die Tools sind aktuell. Der Kern bleibt: ihr versteht, warum die App so gebaut ist.

Wenn das Format zu euch passt: 30 Minuten, unverbindlich. Wir klären, ob Inhouse oder über einen Partner der bessere Weg ist.

← Zum Blog