Moderne React Patterns

Trainer:

Nils Hartmann

Termin:

nach Anfrage

Dauer:

3 Tage

Preis:

2.100,00 EUR exkl. MWSt.

Ort:

Köln/Hamburg

Beschreibung

React Komponenten wurden lange als ES6 Klassen geschrieben, seit React 16.8 (Februar 2019) gibt es nun 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.
In diesem Workshop sehen wir uns die neue API an und lernen, wie für wiederverwendbare Logik und Infrastrukturcode neben Higher-Order Components und Render Properties nun auch Custom Hooks zur Verfügung stehen. Wir sehen uns die Hooks-basierte Redux API an und prüfen, in welchen Fällen der React Context eine Alternative zu Redux sein kann. Außerdem werfen wir einen Blick auf verschiedene Möglichkeiten zur Performance Optimierung.

 

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
• Lokaler Zustand vs. globaler Zustand: was ist „globaler“ Zustand?
• Globale Daten mit dem React Context

 

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)

 

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

 

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 Februar 2020) noch nicht stabil und können deswegen als Konzept/Ausblick vorgestellt werden.

 

Auf Anfrage

  • Typsichere React-Anwendungen mit TypeScript
  • GraphQL Clients mit React

 

Vorkenntnisse

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

 

 

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

Fields marked with an * are required

 

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.

 

 

Hartmann_NIls_300x318

Ü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:

nur als Inhouse-Schulung


Kontakt

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


Das könnte Sie auch interessieren

prev next

Unsere Partner


Die richtige Mischung machts

web & mobile DEVELOPER dotnetpro DWX DDC codekicker Smart Data Developer Conference

developer media ist eine Marke des Medien- und Weiterbildungsunternehmens Ebner Media Group & Co. KG mit Sitz in Ulm und Büros in München und Köln. Mit der DWX – Developer Week und diversen Fachkongressen, Trainings, Inhouse-Schulungen und Webinaren, den Fachzeitschriften dotnetpro und web & mobile developer mit ihren Portalen sowie eBooks und Apps bedient developer media die Zielgruppe der Softwareentwickler mit profundem Fachwissen, topaktuellen News und wichtigen Kontakten.