Nach dem Schulungsbesuch sind Sie in der Lage, Websites von der interaktiven App bis zur statischen Landing-Page mit dem Stack aus React und Next.js zu erstellen und automatisiert zu testen. Sie verstehen die entsprechenden Grundelemente, wie Komponenten, States, JSX und Hooks. Außerdem sind Sie mit Libraries aus dem React-Universum, wie z.B. für Styling, API-Kommunikation oder Formulare, vertraut. Weiter beherrschen Sie den Datentransport zwischen Server und Client und validieren die Daten.
Verwalten des Anwendungszustands mittels des state-Hooks
Erfassen des Zustands von input-Elementen
`styling` - Gestaltung mit CSS, SASS und tailwind
CSS-Module, Sass-Module
CSS-in-JS: Vergleich der Libraries styled-jsx, emotion und styled-components
Ein Blick in das Paket classnames
tailwindcss für das Komponentenstyling
Pre-Rendering mit Next.js
Überblick über Static Site Generation und Server-Side Rendering
Laden von Daten mit getStaticProps und getServerSideProps
Routing und API-Routing mit Next.js
Routing und Routenparameter
Senden von HTTP-Requests via fetch
Definieren von API-Routen
`lifecycle` und `useEffect` für HTTP-Requests
Vor-Rendern dynamischer Routen
Abfragen von Daten während des Pre-Renderings
Workshop
Basis-`App`, Templates und Komponenten
Typische statische und dynamische Seiten und Inhalte
Navigationen und Routing
Formulare, Eingaben und Validierung (Formik)
4 - 5 . Tag: Auch separat buchbar als
TypeScript Grundlagen für React
Statische vs dynamische Typisierung
Typendeklaration bei Variablen, Funktionen, Arrays und Objekten
grundlegende Datentypen
Type Aliases und Interfaces
Generics
Automatisiertes Testen mit Jest und Cypress
`assertional` vs. `interactional` - Teststile
Was ist testgetriebenes Entwickeln?
`arrange`, `act`, `assert` - die drei Phasen eines Tests
Einführung in das funktionale Testen mit Jest
Einführung in End-to-End-Tests mit Cypress
Snapshots, Mocking und Spy
Workshop: Testen von React-Komponenten
Zielgruppe:
Das Seminar richtet sich an Web-Entwickler:innen mit Erfahrung in HTML, CSS und JavaScript, die mit React und Next Web-Anwendungen und Web-Sites erstellen wollen.
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.
