Next.js App Router: Skalierbare Webarchitektur
Architekturentscheidungen, Server Components und Caching sicher für produktive Next.js-Projekte einsetzen
Die wichtigsten Themen
App-Router-Architektur einordnen
Server Components einsetzen
Caching und Revalidation steuern
Server Actions sauber nutzen
Streaming und Suspense integrieren
Migration vom Pages Router planen
Überblick Der Wechsel auf den App Router und React Server Components markiert den bedeutendsten Paradigmenwechsel in der Geschichte von Next.js. Dieses Seminar versetzt Softwareentwicklerinnen und Softwareentwickler in die...
Der Wechsel auf den App Router und React Server Components markiert den bedeutendsten Paradigmenwechsel in der Geschichte von Next.js. Dieses Seminar versetzt Softwareentwicklerinnen und Softwareentwickler in die Lage, hochperformante Webanwendungen zu bauen, die standardmäßig auf dem Server rendern und nur minimales JavaScript an den Client senden.
Der Kurs bricht bewusst mit alten Mustern und konzentriert sich auf die App-Router-Architektur. du arbeitest mit Datenabrufen direkt in Komponenten, verschachtelten Layouts, Streaming, Suspense und Server Actions für Mutationen. Gleichzeitig wird geklärt, wann eine Client Component erforderlich ist, wo Route Handler weiterhin sinnvoll bleiben und wie die Grenze zwischen Server und Client sauber gezogen wird.
Wer zunächst die Grundlagen des Frameworks absichern möchte, findet im Next.js Grundkurs den passenden Einstieg. Dieses Seminar richtet sich dagegen an Entwicklerinnen und Entwickler, die Architekturentscheidungen für produktive App-Router-Projekte treffen, bestehende React- oder Pages-Router-Anwendungen einordnen und Performance, Wartbarkeit sowie SEO-Fähigkeit gezielt verbessern wollen.
Die Themen Dateisystem-basiertes Routing · Pages Router versus App Router · Layouts, Templates und verschachtelte Routen · Route Groups und dynamische Segmente · Server Components und Client Components...
App-Router-Architektur
- Dateisystem-basiertes Routing
- Pages Router versus App Router
- Layouts, Templates und verschachtelte Routen
- Route Groups und dynamische Segmente
React Server Components
- Server Components und Client Components
- Rendering-Strategien im App Router
- Hydration-Grenzen und Client-Bundles
- Composition Patterns zwischen Server und Client
Data Fetching und Caching
- Asynchrone Komponenten im Server-Kontext
- Fetch-Optionen und Cache-Verhalten
- Statische und dynamische Routen
- Revalidation mit Pfaden und Tags
- Deduplizierung von Requests
Streaming und UX-Optimierung
- Loading UI und Error Boundaries
- Suspense für progressive Auslieferung
- Parallel Routes und Intercepting Routes
- Streaming SSR im Routenbaum
Interaktivität und Mutationen
- Server Actions für Formularmutationen
- Route Handler für API-Schnittstellen
- Formular-Handling und Validierung mit Zod
- Optimistic UI Updates
- Cookies und Header am Server
Migration und Produktionsqualität
- Schrittweise Migration vom Pages Router
- SEO-Metadaten API
- Middleware im App-Router-Kontext
- Architekturregeln für wartbare Codebases
Wer hier richtig ist
- Frontend-Developer mit React-Erfahrung und Verantwortung für produktive Webanwendungen
- Fullstack-JavaScript-Engineers mit Next.js- oder Node.js-Bezug
- Software-Architects im Web-Umfeld mit Entscheidungen zu Rendering, Caching und Routing
- Entwicklungsteams, die vom Pages Router, Create React App oder klassischen React-SPAs migrieren
Das lernst du
- Fundierte Architekturentscheidungen für App-Router-Projekte treffen
- Sicherer Einsatz von React Server Components und Client Components
- Data Fetching, Caching und Revalidation gezielt strukturieren
- Server Actions, Route Handler und Formularlogik sinnvoll voneinander abgrenzen
- Wartbare, SEO-freundliche und performante Fullstack-Anwendungen mit Next.js umsetzen
So arbeiten wir
- Technische Deep-Dive-Präsentationen mit Architektur-Skizzen
- Hands-on Live-Coding an einer durchgängigen Übungsanwendung
- Direkte Umsetzung zentraler Konzepte im eigenen Code
- Code-Reviews zu Routing, Caching und Component Boundaries
- Architektur-Diskussionen zu typischen Projektentscheidungen
Empfohlene Vorkenntnisse
- Solide Kenntnisse in HTML, CSS und modernem JavaScript ab ES6
- Sichere React-Erfahrung mit Hooks, Props, State und Component Composition
- Grundverständnis von TypeScript empfohlen, zum Beispiel aus React mit TypeScript
- Fortgeschrittene React-Kenntnisse hilfreich, etwa aus dem React Aufbaukurs
Dein Fahrplan
Einführung in das App-Router-Modell, zentrale Datei-Konventionen und die Unterscheidung zwischen Server- und Client-Runtimes. Aufbau erster Routing-Strukturen, verschachtelter Layouts und Route Groups. Anschließend Arbeit mit React Server Components, Client Boundaries, Hydration-Grenzen und Composition Patterns.
Organisatorisches
Lernformate
Unsere Seminare bieten dir maximale Flexibilität: Du kannst zwischen Live-Online und Vor Ort in unseren modernen Schulungszentren im D-A-CH Raum wählen. Beide Formate garantieren dir die gleiche hohe Qualität und interaktive Lernerfahrung.
Schulungsarten
Wir bieten dir verschiedene Schulungsarten: Offene Seminare, Firmenseminare für Teams und Inhouse-Schulungen direkt bei dir vor Ort. So findest du genau das Format, das zu deinen Bedürfnissen passt.
Uhrzeiten
9:00-16:00 Uhr
Aktuelle Software
In unseren offenen Kursen arbeiten wir mit der aktuellsten Software-Version. So lernst du direkt mit den Tools und Features, die du auch in deinem Arbeitsalltag verwendest - praxisnah und zukunftsorientiert. Bei Inhouse- und Firmenschulungen bestimmt ihr die Version.
Deine Vorteile
Zufriedenheitsgarantie
Wir sind von unserer Qualität überzeugt. Sollte ein Training einmal nicht deinen Erwartungen entsprechen, bieten wir dir an, den Kurs kostenlos zu wiederholen oder ein anderes Training zu besuchen. Ohne Risiko, ohne Diskussion.
Inklusivleistungen
Deine Teilnahme beinhaltet: Schulungsmaterial, Zertifikat, Verpflegung (bei Präsenzveranstaltungen) und persönliche Betreuung durch unsere Trainer und unser Orga-Team. Alles aus einer Hand - keine versteckten Kosten.
Lernen von Experten
Unsere Trainer sind zertifizierte und erfahrene Profis mit jahrelanger Berufserfahrung. Sie vermitteln dir in den Kursen nicht nur theoretisches Wissen, sondern teilen ihre Erfahrungen aus realen Projekten und helfen dir, das Gelernte direkt in deiner täglichen Arbeit anzuwenden. Das ist kein Werbeversprechen, sondern unser Anspruch. Am besten siehst du das in unseren Bewertungen, z.B. auch bei Google.
Keine Vorkasse
Du zahlst erst nach dem Seminar. Keine Vorkasse, keine Vorauszahlung - so kannst du sicher sein, dass du nur für das bezahlst, was du auch wirklich erhalten hast. Die Rechnung erhältst du erst nach Kursbeginn.
Max. 8 Teilnehmende
Wir setzen auf kleine Gruppen, damit du die Aufmerksamkeit bekommst, die du verdienst. So haben wir mehr Zeit für deine individuellen Fragen und können gezielt auf deine Bedürfnisse eingehen.
Termine & Buchung
Vor Ort
Online
Nicht der passende Termin dabei?
Wir finden eine Lösung: anderer Termin, mehrere Teilnehmer, Inhouse-Schulung oder individuelle Beratung.
Lieber gleich das ganze Team schulen?
Diese Schulung gibt es auch exklusiv für dein Unternehmen, bei euch vor Ort, an unseren Standorten oder Live-Online. Inhalte und Termine nach Maß.
Inhouse-Schulung
Wir kommen zu euch: diese Schulung maßgeschneidert in euren Räumen, für Unternehmen und Behörden.
- Inhalte exakt auf euch zugeschnitten
- Termine nach euren Bedürfnissen
- Günstiger ab mehreren Teilnehmern
- Vertraute Umgebung, kein Reiseaufwand
Firmen-Seminar
Exklusiv für dein Team an einem unserer Standorte oder Live-Online, individuell angepasst.
- Geschlossene Gruppe aus eurem Haus
- Individuelle Terminplanung
- An unseren Standorten oder Live-Online
- Angepasste Inhalte
Fragen und Antworten zu Next.js App Router: Skalierbare Webarchitektur
Ist das Seminar für Anfängerinnen und Anfänger in React geeignet?
Nein. Der App Router setzt ein solides Verständnis von React, Komponentenlogik, Hooks und modernen JavaScript-Konzepten voraus. Für den Einstieg ist zunächst ein React-Grundlagen- oder Aufbau-Training sinnvoll.
Behandelt das Seminar auch den alten Pages Router?
Der Pages Router wird im Kontext von Migration und Architekturvergleich behandelt. Der Schwerpunkt liegt jedoch klar auf dem App Router, React Server Components und den damit verbundenen Patterns für neue Next.js-Projekte.
Wann sind Server Actions sinnvoll und wann Route Handler?
Im Seminar wird diese Abgrenzung ausdrücklich behandelt. Server Actions eignen sich besonders für Mutationen aus UI-Flows, während Route Handler weiterhin für API-Schnittstellen, Integrationen und klar getrennte Backend-Endpunkte relevant bleiben.
Hilft das Training bei der Migration bestehender React-Anwendungen?
Ja, typische Migrationspfade vom Pages Router oder von klassischen React-SPAs werden eingeordnet. Für Teams mit umfangreicher Legacy-Codebasis passt ergänzend das Seminar Legacy-React zu Next.js App Router migrieren.
Wird TypeScript im Seminar verwendet?
Ja, die Beispiele orientieren sich an professioneller React- und Next.js-Entwicklung mit TypeScript. Erwartet wird kein Expertinnen- oder Expertenniveau, aber ein Grundverständnis typisierter Komponenten und Funktionssignaturen ist hilfreich.
Geht es auch um Performance und Caching in produktiven Anwendungen?
Ja. Data Fetching, Cache-Verhalten, Revalidation, Streaming und Suspense gehören zu den zentralen Themen. Wer danach tiefer in Skalierung und Caching-Strategien einsteigen möchte, kann das Next.js Deep Dive Training: Caching & Skalierung anschließen.
Weitere häufig gestellte Fragen und Antworten findest du in den FAQs .
Passende Schulungen nach dem Kurs
Unser Qualitätsversprechen: Wissen, das in der Praxis funktioniert
Aus der Praxis für die Praxis
Schluss mit theoretischem Ballast. Wir trainieren dich für reale IT-Herausforderungen, nicht für Multiple-Choice-Tests. Unsere Trainer vermitteln dir genau das Wissen, das am nächsten Montagmorgen im Job wirklich funktioniert.
Individuell statt "Schema F"
Deine Fragen passen nicht ins Standard-Skript? Bei uns schon. Wir verzichten auf starre Lehrpläne und geben deinen konkreten Projekt-Fragen Raum. Unsere Trainer passen die Inhalte flexibel an das an, was dich und dein Team aktuell weiterbringt.
Maximale Freiheit: Remote oder vor Ort
Lerne so, wie es in deinen Alltag passt - ohne Reise-Stress und Zeitverlust. Egal ob remote, hybrid oder präsent vor Ort: Wir garantieren dir ein nahtloses und effektives Lernerlebnis, egal von wo du dich zuschaltest.
Mit Zufriedenheitsgarantie
Wir sind von unserer Qualität überzeugt - und wollen, dass du es auch bist. Sollte ein Training einmal nicht deinen Erwartungen entsprechen, bieten wir dir an, den Kurs kostenlos zu wiederholen oder ein anderes Training zu besuchen. Ohne Risiko, ohne Diskussion.
Über 20.000 Unternehmen und Behörden vertrauen auf uns