SEMINAR
W-3030
React
4 Tage
Standorte
Termine
React und Redux (mit TypeScript)
Kein Badge verfügbar.
Ihr Seminar buchen
Seminarinhalte
Ziele
In diesem praxisorientierten Training erhalten Teilnehmende einen umfassenden Einstieg in die Entwicklung moderner Frontend-Anwendungen mit React, Redux und TypeScript. Sie lernen, wie diese Technologien ineinandergreifen, um performante und wartbare Benutzeroberflächen zu realisieren – von der Komponentenerstellung bis hin zur strukturierten Zustandsverwaltung über Redux.
Dabei steht nicht nur die Theorie im Fokus: Anhand praxisnaher Beispiele wird vermittelt, wie sich React effizient für Single-Page-Anwendungen einsetzen lässt und wie Redux mit Hilfe von Reducern und Middleware komplexe Datenflüsse kontrolliert. Ergänzend dazu erfahren die Teilnehmenden, wie TypeScript den Entwicklungsprozess durch Typensicherheit unterstützt und aktuelle Konzepte wie Hooks sinnvoll integriert werden können.
Nach Abschluss sind die Teilnehmenden in der Lage, skalierbare React-Projekte zu entwickeln, moderne State-Management-Ansätze anzuwenden und ihre Anwendungen gemäß bewährter Best Practices umzusetzen.
Inhalte
Einführung & Überblick
- Vergleich moderner Frameworks: React, Vue, Angular
- Konzepte von komponentenbasiertem, deklarativem Rendering
- Projektstart mit create-react-app
JavaScript-Grundlagen für React
- Nutzung von Node.js und npm
- Moderne JS-Features: ES6+ (z. B. Module, Arrow Functions)
- Funktionale Programmierung in der Praxis
TypeScript für React
- Unterschiede: statische vs. dynamische Typisierung
- Typisierung für Variablen, Funktionen, Arrays, Objekte
- Einsatz von Interfaces und Typen in React-Komponenten
State Management mit Hooks
- State-Verwaltung mit useState
- Formularzustände erfassen
- Dynamische Darstellung via deklarativem Rendering
JSX & Templatesprache
- Einführung in JSX
- Binding von Inhalten und Props
- Eventhandling, Wiederholungen, Bedingte Darstellung
- Styling: Klassen, Inline-Stile
Komponentenentwicklung
- Einbindung externer Komponenten & Libraries
- Eigene Komponenten erstellen & typisieren (Props, Events, State)
- Analyse mit React Developer Tools
- Datenfluss zwischen Komponenten steuern
API-Anbindung
- HTTP-Requests mit fetch
- Nutzung von useEffect für asynchrone Datenabfragen
Klassenkomponenten (optional)
- Aufbau als Klasse vs. Funktion
- Umgang mit this
- State & Props in Klassen
React Tools & Erweiterungen
- Routing mit React Router
- Kontext-API zur globalen Zustandsverteilung
- Eigene und externe Hooks (z. B. react-query)
- Styling- und Formularbibliotheken
State Management mit Reducer & Redux
- Einführung in useReducer
- Architektur von Redux: Store, Actions, Reducer
- Setup mit Redux Toolkit
- Verwendung von Redux DevTools
- Integration in React (Hooks & Container-Komponenten)
- Aufteilen & Kombinieren von Reducern
- Async-Logik mit Thunk
- Typisierung mit TypeScript
- Redux-Hilfen: createSlice, createAction, createReducer
- Middleware & Selektoren
Testen & Demos
- Komponenten-Dokumentation mit Storybook
- Unit-Tests mit Jest
- Komponenten-Tests mit react-testing-library
- Snapshot-Tests
App-Entwicklung & Optimierung
- Progressive Web Apps (PWA) mit React
- Einstieg in React Native
- Performance-Tuning: Profiler, React.memo, useMemo, useCallback
- Code Splitting & Lazy Loading
- Server-Side Rendering (SSR) & Static Site Generators
Badge
Kein Badge verfügbar.
Vorkenntnisse
Die Voraussetzung zur Teilnahme ist grundlegende Erfahrung im Umgang mit HTML und JavaScript, um Konzepte und Techniken effizient anwenden und nachvollziehen zu können.
Zielgruppe
Dieser Kurs richtet sich an Entwickler, die moderne Webanwendungen mit React und Redux realisieren möchten und dabei den Einsatz von TypeScript für mehr Struktur und Sicherheit im Code schätzen.
Methoden
KONTAKT
Martin Heubeck
Sales Gruppenseminare und Inhouse
Mo – Fr 8:00 – 17:00 Uhr
E-Mail senden
+49 891 22216949
+49 800 3060303
JETZT UNVERBINDLICHEN BERATUNGSTERMIN BUCHEN
„Im Beratungsprozess lege ich besonderen Wert darauf, die besonderen Bedürfnisse und Ziele Ihres Unternehmens genau zu verstehen. Gemeinsam mit Ihnen entwickle ich passgenaue Lösungen, die sowohl fachliche Anforderungen erfüllen als auch die persönliche Weiterentwicklung der Mitarbeitenden fördern – immer praxisnah und auf Augenhöhe.“
Seien Sie nicht nur am Ergebnis orientiert. Sondern auch am Erlebnis.
