React und Next.js - Grundlagen

Webinar - GFU Cyrus AG

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.

Termin	Ort	Preis^*
02.06.2025- 04.06.2025	online	1.844,50 €	jetzt buchen
13.10.2025- 15.10.2025	online	1.844,50 €	jetzt buchen
12.01.2026- 14.01.2026	Köln	1.844,50 €	jetzt buchen
12.01.2026- 14.01.2026	online	1.844,50 €	jetzt buchen

Alle Termine anzeigen

^*Alle Preise verstehen sich inkl. MwSt.

Detaillierte Informationen zum Seminar

Inhalte:

React-Workshop zur Einführung
- Einrichten von Visual Studio Code für React und Next.js
- Einrichten eines React-Projektes
- Was sind React-Komponenten?
- JSX: die JavaScript-basierte Templatesprache von React
- Deklaratives Rendering
- `states`, `props` und `hooks`
JavaScript Essentials für React
- - Module (import und export)
- `classes`, `functions`, `objects`
- `arrow-functions`- Pfeilfunktionen
- `destructuring`,
- `spread`-Operator, `rest`-Parameter
`fullstack`mit Next.js
- Einrichten eines Next.js-Projektes
- React vs. Vue vs. Angular
- React-Komponenten definieren
Komponenten in React und Next.js
- Eigene Komponenten erstellen
- Komponenten untersuchen mit den React Developer Tools
- Datenfluss zwischen Komponenten
- Next.js - Komponenten - `Link`, `Image`, `Head`, `Script`, `Document`, `Html`, `Main`, `NextScript`, `NoScript`, `Title`
- Komponentenlibraries für React und Next.js
`props`, `states`, Ereignisse
- Binden von Inhalten und `props`
- Eventhandler
- Zustände und Zustandsänderungen
- `if`, `ternary` - Bedingungen
- 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)

Dauer/zeitlicher Ablauf:

3 Tage

Zielgruppe:

Web-Entwickler:innen mit Erfahrung in HTML, CSS und JavaScript, die mit React und Next Web-Anwendungen und Web-Sites erstellen wollen.

Seminarkennung:

R78897

Nach unten

Nach oben

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.

Akzeptieren Nicht akzeptieren

Ihr Name:

Firma (optional):

Ihre E-Mail-Adresse:

Telefonnummer (optional):

Ihre Nachricht:

Um Spam abzuwehren, geben Sie bitte die Buchstaben auf dem Bild in das Textfeld ein:

Bei der Verarbeitung Ihrer personenbezogenen Daten im Zusammenhang mit der Kontaktfunktion beachten wir die gesetzlichen Bestimmungen. Unsere ausführlichen Datenschutzinformationen finden Sie hier. Bei der Kontakt-Funktion erhobene Daten werden nur an den jeweiligen Anbieter weitergeleitet und sind nötig, damit der Anbieter auf Ihr Anliegen reagieren kann.

React und Next.js - Grundlagen

Detaillierte Informationen zum Seminar

Anbieterinformationen