Nach dem Seminar können Sie Webanwendungen und Websites mit React und Next.js erstellen und grundlegende automatisierte Tests umsetzen. Sie verstehen Komponenten, JSX, Props, State und Hooks und können Benutzerinteraktionen sowie Formulare verarbeiten. Im Next.js App Router können Sie Routing und Layouts strukturieren, Server und Client Components unterscheiden und Daten server- sowie clientseitig bereitstellen. Sie kennen die Grundlagen von Caching und Revalidierung und können serverseitige Endpunkte mit Route Handlers entwickeln. Darüber hinaus können Sie TypeScript zur Typisierung Ihres Codes einsetzen und mit Jest und Cypress erste Tests für Ihre Anwendungen erstellen.
Visual Studio Code und ein React-Projekt einrichten
Komponenten, JSX und deklaratives Rendering
State, Props und Hooks
JavaScript Essentials für React
Module mit import und export
Klassen, Funktionen, Objekte und Pfeilfunktionen
Destructuring, Spread-Operator und Rest-Parameter
Fullstack mit Next.js
Ein Next.js-Projekt einrichten
App Router: dateibasiertes Routing, Layouts sowie Server und Client Components
React, Vue und Angular im Vergleich
Komponenten in React und Next.js
Eigene Komponenten, Datenfluss und React Developer Tools
Navigation mit Link, Bilder mit Image und Skripte mit Script
Metadaten im App Router
Komponentenbibliotheken
Props, State und Ereignisse
Inhalte und Props binden
Eventhandler, Zustandsänderungen und bedingte Darstellung
Anwendungszustand mit useState verwalten
Eingaben erfassen
Styling mit CSS, Sass und Tailwind CSS
CSS- und Sass-Module
styled-jsx, Emotion und styled-components im Vergleich
classnames und Tailwind CSS
Rendering und Datenbereitstellung im App Router
Statische Generierung und serverseitiges Rendering
Datenbereitstellung, Caching und Revalidierung
Dynamische Routen vorab rendern und Daten serverseitig abfragen
Routing und serverseitige Endpunkte
Routenparameter und Navigation
HTTP-Anfragen mit fetch
Serverseitige Endpunkte mit Route Handlers
Lebenszyklus und useEffect für clientseitige HTTP-Anfragen
Praxisworkshop
Basisanwendung, Layouts und Komponenten
Statische und dynamische Seiten
Navigation und Routing
Formulare, Eingaben und Validierung mit Formik
4 - 5 . Tag: Auch separat buchbar als
TypeScript-Grundlagen für React
Statische und dynamische Typisierung
Typdeklarationen für Variablen, Funktionen, Arrays und Objekte
Grundlegende Datentypen, Type Aliases, Interfaces und Generics
Automatisiertes Testen mit Jest und Cypress
Assertionsbasierte und interaktionsorientierte Teststile
Testgetriebene Entwicklung
Arrange, Act, Assert
Funktionale Tests mit Jest und End-to-End-Tests mit Cypress
Snapshots, Mocking und Spies
Workshop: React-Komponenten testen
Dauer/zeitlicher Ablauf:
5 Tage
Zielgruppe:
Das Seminar richtet sich an Webentwickler, die mit React und Next.js Webanwendungen und Websites erstellen und ihre Kenntnisse um TypeScript und automatisiertes Testen erweitern möchten.
Teilnahmevoraussetzungen
Sie benötigen praktische Erfahrung mit HTML, CSS und JavaScript.
Vorkenntnisse in React und Next.js sind nicht erforderlich.
Wir setzen Analyse-Cookies ein, um Ihre Zufriedenheit bei der Nutzung unserer Webseite zu verbessern.
Diese Cookies werden nicht automatisiert gesetzt.
Wenn Sie mit dem Einsatz dieser Cookies einverstanden sind, klicken Sie bitte auf Akzeptieren.
Weitere Informationen finden Sie hier.
