Hinweis zum Anbieter: Dieses E-Learning wird auf der Plattform Udemy angeboten. Kauf, Zahlung, Kurszugang, Inhalte und Support erfolgen über Udemy. Preise, Verfügbarkeit und Kursbedingungen können sich ändern und werden von Udemy festgelegt.

Beschreibung

Next.js verstehen und moderne React-Anwendungen entwickeln – praxisnah und Schritt für Schritt! Lerne, wie du mit Next.js leistungsfähige Webanwendungen erstellst, React-Projekte erweiterst und Fullstack-Funktionen direkt in deine Apps integrierst.

In diesem Kurs lernst du die wichtigsten Konzepte von Next.js kennen – vom Einstieg über Routing, Rendering und Datenabruf bis hin zu Server Actions, Caching, Optimierung und Authentifizierung. Dabei arbeitest du mit modernen Next.js-Funktionen wie App Router, Pages Router, Server Components und Client Components.

Der Kurs richtet sich an Entwicklerinnen und Entwickler, die bereits mit React gearbeitet haben und ihre Kenntnisse gezielt ausbauen möchten. Ein React-Refresher ist enthalten, sodass du zentrale React-Grundlagen wiederholen kannst, bevor du tiefer in Next.js einsteigst.

Das wirst du lernen

• Next.js-Projekte von Grund auf erstellen und strukturieren
• React-Anwendungen mit Next.js zu Fullstack-Apps erweitern
• App Router und Pages Router verstehen und einsetzen
• File-based Routing, dynamische Routen und Catch-all Routes nutzen
• Server Components und Client Components sinnvoll kombinieren
• Daten abrufen, verändern und mit Server Actions verarbeiten
• Pre-Rendering, Server-Side Rendering und Caching gezielt einsetzen
• Formulare, Datei-Uploads und Validierung in Next.js umsetzen
• SEO-relevante Funktionen wie Metadata und Bildoptimierung nutzen
• Authentifizierung und geschützte Bereiche in Next.js-Anwendungen integrieren

Anforderungen

• Grundkenntnisse in React werden empfohlen
• Vorkenntnisse in Next.js sind nicht erforderlich
• Grundlagen in JavaScript, HTML und CSS sind hilfreich
• Eine lokale Entwicklungsumgebung mit Node.js wird empfohlen
• Interesse an moderner Webentwicklung mit React und Fullstack-Funktionen

Für wen eignet sich der Kurs

• React-Entwickler, die den nächsten Schritt mit Next.js gehen möchten
• Frontend-Entwickler, die Fullstack-Anwendungen mit React entwickeln wollen
• Webentwickler, die moderne Routing- und Rendering-Konzepte lernen möchten
• Entwickler, die App Router, Server Components und Server Actions praktisch einsetzen möchten
• Alle, die produktionsnahe React- und Next.js-Projekte besser verstehen wollen

Kursdetails

Der Kurs vermittelt dir praxisnah, wie du mit Next.js und React moderne Webanwendungen entwickelst. Du lernst, wie Next.js auf React aufbaut, welche Vorteile serverseitiges Rendering bietet und wie du dynamische, performante und SEO-freundliche Anwendungen umsetzt.

Im Mittelpunkt stehen reale Anwendungsszenarien: Du arbeitest mit Routing, Datenabruf, Formularen, Server Actions, Caching, Datei-Uploads, Bildoptimierung und Authentifizierung. Zusätzlich lernst du, wie App Router und Pages Router funktionieren und wann welcher Ansatz sinnvoll ist.

Der Kurs kombiniert Grundlagen, vertiefende Module und praktische Projekte. Dadurch eignet er sich sowohl für den strukturierten Einstieg in Next.js als auch für React-Entwickler, die vorhandenes Wissen auffrischen und erweitern möchten.

Kursinhalt – 23 Sektionen – 452 Lektionen - 40 h 19 min Gesamtdauer

Der Kurs führt dich Schritt für Schritt durch die wichtigsten Bereiche der modernen Next.js-Entwicklung. Die Inhalte reichen vom Einstieg in Next.js über einen optionalen React-Refresher bis zu fortgeschrittenen Themen wie Routing, Datenverarbeitung, Caching, Optimierung und Authentifizierung.

• Einführung in Next.js und Abgrenzung zu klassischen React-Anwendungen
• Erstellung erster Next.js-Projekte und Analyse der Projektstruktur
• Optionaler React-Refresher mit Komponenten, Props, State und Hooks
• Next.js Essentials mit App Router, Seiten, Layouts und Komponenten
• File-based Routing, dynamische Routen und Catch-all Routes
• Server Components, Client Components und deren Zusammenspiel
• Parallel Routes, Intercepting Routes, Route Groups und Middleware
• Datenabruf über APIs, Datenbanken und Server Components
• Formularverarbeitung, Mutationen und Server Actions
• Validierung, Datei-Uploads und Speicherung von Nutzerdaten
• Caching, Revalidierung und Produktionsverhalten von Next.js
• Bildoptimierung mit der Next.js Image-Komponente
• Statische und dynamische Metadata für SEO und Performance
• Authentifizierung mit Signup, Login, Sessions und geschützten Routen
• Praxisprojekte zur Anwendung der zentralen Next.js- und React-Konzepte