Moderne React Patterns

Trainer:

Nils Hartmann

Termin:

nach Anfrage

Dauer:

3 Tage

Preis:

2.100,00 EUR exkl. MWSt.

Ort:

Köln/Hamburg - Inhouse - remote

Beschreibung

React-Komponenten wurden lange als ES6 Klassen geschrieben. Seit React 16.8 gibt es zusätzlich die funktionale Hooks API. Die Konsequenzen, die sich aus dieser neuen API ergeben, gehen aber weit über das neue API selbst hinaus. Vielmehr gibt es nun eine Reihe neuer Möglichkeiten, React-Anwendungen zu entwickeln und zu strukturieren.
Diese sehen wir uns in diesem Workshop an und lernen, wie neben Higher-Order Components und Render Properties nun auch Custom Hooks  für wiederverwendbare Logik und Infrastrukturcode zur Verfügung stehen. Wir nehmen die Hooks-basierte Redux API unter die Lupe und prüfen, in welchen Fällen der React Context eine Alternative zu Redux ist. Außerdem setzten wir verschiedene Möglichkeiten zur Performance Optimierung um.

 

Was wird behandelt

Einführung in die React Hooks API (bei Bedarf)
• Grundlagen und Motivation der Hooks API
• Unterschiede zur Klassen API
• Hooks zum Verwalten von Zustand und zum Ausführen von Seiteneffekten
(asynchrone Server-Zugriffe)

 

Zustandsverwaltung
• Lokaler Zustand mit useState und useReducer Hook
• Arbeiten mit immutable Datenstrukturen
• Arten von Zustand. lokaler vs. globaler Zustand, einfacher vs. komplexer Zustand
• Globale Daten mit dem React Context

 

Data Fetching
• Effizientes Arbeiten mit globalen Daten vom Server
• Caching von Server-Daten
• Request-Zyklen und Fehlerbehandlung von HTTP Calls

 

React Patterns für wiederverwendbaren Code
• Hintergrund: Render Properties und Higher-Order-Components
• Wiederverwendbarer Code mit Custom Hooks
• Custom Hooks oder Komponenten?

 

Externe Zustandsverwaltung mit Redux
• Einführung in Redux (bei Bedarf)
• Die Hooks API von Redux
• React Context (mit useReducer) oder Redux:
o Wo sind Unterschiede?
o Wo sind Gemeinsamkeiten?
o Für welche Szenarien eignet sich welcher Ansatz?
• Typsicherheit von Redux Anwendungen mit TypeScript
• Das Redux Toolkit (das „offizielle“ Toolset für Redux)
• Data Fetching mit der Redux Toolkit Query Library

 

Performance von React-Anwendungen
• Wo kann es Performance Engpässe geben?
• Performance-Analyse mit dem React Profiler
• Code-Splitting zur Verbesserung von Ladezeiten der Anwendung mit React.lazy und Suspense API
• Möglichkeiten zur Verbesserung der Performance zur Laufzeit mit useCallback und useMemo

 

Ausblick: Concurrent Rendering und Suspense for Data Loading
• Wie kann Suspense zum Laden von Daten verwendet werden?
• Was sind Anwendungsfälle für Suspense und Concurrent Rendering?

Hinweis: Diese APIs sind (Stand Mai 2021) noch nicht stabil und können deswegen als Konzept/Ausblick vorgestellt werden.

 

Auf Anfrage

  • Typsichere React-Anwendungen mit TypeScript: Einführung in die Sprache TypeScript, React-Komponenten mit TypeScript entwickeln
  • GraphQL Clients mit React

 

Vorkenntnisse

• React-Kenntnisse (Klassen API)
• JavaScript (ES6)

 

Hinweis

Der komplette Workshop kann je nach Interesse in JavaScript oder in TypeScript durchgeführt werden.

 

Ablauf

Unsere Trainings starten täglich um 9:00 und enden gegen 17:00 Uhr. Die Kaffee- und Mittagspausen legen unsere Trainer je nach Lernfortschritt mit den Teilnehmern fest. Im Trainingspreis enthalten sind u.a.:

Begrüßungsgetränke (Tee/Kaffee), Erfrischungsgetränke im Trainingsraum, Pausen- und Mittagsverpflegung, Papier und Stifte, freier WLAN-Zugang, Zertifikat über Ihre Teilnahme.

 

Anmeldung

Vorregistrierung zum Training

auch ohne konkreten Termin, kann sich ein potenzieller Teilnehmer registrieren
  • Date Format: DD slash MM slash YYYY

 

Inhouse-Schulung

Sie möchten das Training gerne als Inhouse-Schulung buchen? Kein Problem — sprechen Sie uns an, und wir entwickeln ein auf Ihre Anforderungen hin individuell zugeschnittenes Konzept und Angebot. Erste Informationen finden Sie in diesem Info-PDF.

 

 

Über Nils Hartmann

Nils Hartmann ist freiberuflicher Softwareentwickler, -architekt, Trainer und Coach aus Hamburg. Er beschäftigt sich mit der serverseitigen Entwicklung mit Java und Spring sowie der Frontend-Entwicklung mit JavaScript. Er unterstützt und schult Teams beim Ein- und Umstieg in die Entwicklung von Single-Page-Anwendungen mit den Schwerpunkten React, TypeScript und GraphQL. Nils ist Autor des Buches „React - Grundlagen, fortgeschrittene Techniken und Praxistipps“ (dpunkt).

Weitere Produkte von Nils Hartmann:

Einführung in GraphQL

nach Anfrage

Uhrzeit:

09:00 - 17:00 Uhr

Dauer:

2 Tage

Ort:

Inhouse-Schulung oder remote


Kontakt

Susanne Herl
Projektmanagerin Seminare
E-Mail: susanne.herl@developer-media.de
Tel. +49 (0)731 880058-835


Das könnte Sie auch interessieren

prev next

Unsere Partner


Die richtige Mischung macht's

DDC DWX DWX DWX DWX web & mobile DEVELOPER dotnetpro

Developer Media ist die Fort- und Weiterbildungsmarke für Softwareentwickler und -architekten innerhalb der Ebner Media Group. Mit den Fachmagazinen dotnetpro und web & mobile developer, den Fachkonferenzen DWX, WDC, DDC und JVM-Con sowie zahlreichen Remote- und Präsenz-Seminaren liefert Developer Media seinen Besuchern, Teilnehmern und Lesern hochqualitative und lösungsorientierte Fachinformationen.