Header Background
 
 
 
seminar logo

React und Redux (mit TypeScript)

Seminardauer: 4 Tage

Ziele

In dieser 4-tägigen Schulung zu "React und Redux (mit TypeScript)" lernen Sie die leistungsstarke Kombination von React und Redux kennen, um komplexe Frontend-Interfaces zu erstellen. Diese Technologien werden von bekannten Websites wie Airbnb oder Reddit erfolgreich eingesetzt.

React ist die führende Bibliothek zur Entwicklung von Single-Page-Anwendungen (SPAs). In Verbindung mit Redux ermöglicht es das effiziente Verwalten komplexer Anwendungszustände mithilfe von Reducern.

In dieser Schulung werden auch aktuelle Technologien wie Hooks und TypeScript ausführlich behandelt. Am Ende des Kurses werden die Teilnehmer in der Lage sein, Anwendungen unterschiedlicher Komplexität mit React umzusetzen und dabei bewährte Methoden zu berücksichtigen.

Zielgruppe

  • Entwickler

Voraussetzungen

Für eine optimale Teilnahme am Kurs empfehlen wir folgende Vorkenntnisse:

  • Erfahrungen mit HTML und JavaScript

Lernmethodik

Die Schulung bietet Ihnen eine ausgewogene Mischung aus Theorie und Praxis in einer erstklassigen Lernumgebung. Profitieren Sie vom direkten Austausch mit unseren projekterfahrenen Trainern und anderen Teilnehmern, um Ihren Lernerfolg zu maximieren.

Agenda

Entwicklung moderner Frontend-Anwendungen

  • Überblick und Gemeinsamkeiten von React, Vue und Angular
  • deklaratives Rendering
  • Komponenten - eigene HTML-Tags definieren
  • Initialisierung eines React-Projektes mittels create-react-app

JavaScript Grundlagen für React (soweit benötigt)

  • Entwicklung mit node.js und npm
  • JavaScript Versionen und Neuerungen
  • Module (import und export)
  • Pfeilfunktionen
  • Funktionale Programmierung in JavaScript

TypeScript Grundlagen für React

  • statische vs dynamische Typisierung
  • Typendeklaration bei Variablen, Funktionen, Arrays und Objekten
  • grundlegende Datentypen
  • Types und Interfaces

State (Anwendungszustand) verwalten

  • deklaratives Rendering
  • Verwalten des Anwendungszustands mittels state-Hook
  • Erfassen des Zustands von input-Elementen

React-Templatesprache

  • JSX: die JavaScript-basierte Templatesprache von React
  • Binden von Inhalten und Props
  • Eventhandler
  • Elemente wiederholen
  • if / else
  • CSS-Klassen und Stile

Komponenten

  • Einbinden vorgefertigter Komponenten
  • Komponentenlibraries für React
  • Definieren eigener Komponenten
  • Props und Events in eigenen Komponenten
  • Prop- Event- und State-Typen in TypeScript
  • Datenfluss zwischen Komponenten
  • Komponenten untersuchen mit den React Developer Tools

APIs aus React abfragen

  • senden von HTTP-Requests via _fetch_
  • verwenden des effect-Hooks, um HTTP-Requests auszulösen

Klassenkomponenten

  • Definieren einer Komponente als Funktion oder als Klasse
  • JavaScript: "this" und seine Eigenheiten
  • State in Klassenkomponenten
  • Props und Events in Klassenkomponenten

React Tools und Libraries

  • React Router
  • Context: Teilen von Daten über einen Komponentenbaum hinweg
  • der Effect-Hook im Detail
  • externe und eigene Hooks (z.B. react-query)
  • Styling Libraries
  • Formular-Libraries

State Management mit Reducern

  • Überblick über State Management
  • State Management mit Reducern und reinen Funktionen
  • Einsetzen des Reducer-Hooks in React
  • Überblick über State Management mit Redux

Testen und Komponentendemos

  • Komponentendemos mit Storybook
  • Testen von JavaScript-Funktionen mit Jest
  • Testen von React-Komponenten mit react-testing-library
  • Snapshot-Tests

App-Entwicklung mit React

  • Progressive Web Apps: Erstellen von installierbaren mobilen und Desktop-Anwendungen
  • Überblick über React Native

Performanceoptimierung und Pre-Rendering

  • React Developer Tools Profiler
  • React.memo, Callback-Hook und Memo-Hook
  • Static Site Generators
  • serverseitiges Rendering
  • Code splitting

Redux

  • State Management in Redux (State, Actions und Reducer)
  • Einrichten eines Redux-Stores mittels Redux Toolkit
  • Verwenden der Redux devtools
  • Einbinden von Redux in ein React-Projekt (Redux Hooks, Container-Komponenten)
  • Aufteilen / Kombinieren von Reducern
  • asynchrone Actions und API-Abfragen mittels Thunk
  • Redux und TypeScript
  • Redux Hilfsfunktionen (createAction, createReducer, createSlice)
  • Selektoren und Memoisation
  • Middleware

Open Badge - Ihr digitaler Kompetenznachweis

IT-Schulungen Badge: React und Redux (mit TypeScript)

Durch die erfolgreiche Teilnahme an einem Kurs bei IT-Schulungen.com erlangen Sie nicht nur Fachkenntnisse und Fähigkeiten, sondern bekommen zusätzlich zu Ihrem Teilnahmezertifikat ein Open Badge als digitalen Nachweis Ihrer Kompetenz.

Sie können diesen in Ihrem persönlichen und kostenfreien Mein IT-Schulungen.com Konto abrufen. Ihre verdienten Badges lassen sich problemlos in sozialen Netzwerken integrieren und weitergeben.

Mehr zu den Vorteilen von Badges

Kurz vor Durchführung

TerminStandortAktion
25.06. - 28.06.2024 Hamburg Seminar jetzt anfragen
22.07. - 25.07.2024 Köln Seminar jetzt anfragen
13.08. - 16.08.2024 Köln Seminar jetzt anfragen
16.09. - 19.09.2024 Nürnberg Seminar jetzt anfragen
 
Anmeldungen vorhanden

1.) Wählen Sie den Seminartyp:




2.) Wählen Sie Ort und Datum:

1.795,00 € Preis pro Person

spacing line2.136,05 € inkl. 19% MwSt
Seminarunterlagen zzgl.
Verpflegung zzgl.

Seminar jetzt anfragen Auf den Merkzettel
PDF IconPDF Icon
Folgende Schulungsthemen könnten Sie alternativ interessieren.
Es gibt weiterführende Kurse, die auf diesem Schulungsthema aufbauen.
 

Diese Seite weiterempfehlen:

0
Merkzettel öffnen
0
Besuchsverlauf ansehen
IT-Schulungen.com Control Panel
Warnung Icon Sie haben in Ihrem Browser Javascript deaktiviert! Bitte aktivieren Sie Javascript um eine korrekte Darstellung und Funktionsweise von IT-Schulungen zu gewährleisten. Warnung Icon