next.js kursbild

Schaffe in kürzester Zeit den praktischen Einstieg in die Fullstack-Webentwicklung mit dem Next.js Framework

... und lerne, wie du mithilfe von JavaScript und dem Next.js Framework eigene Fullstack-Webanwendungen programmieren kannst, um deine eigenen Ideen umzusetzen und zeitgleich deinen persönlichen Wert auf dem Arbeitsmarkt drastisch zu steigern.

Jetzt deinen Premium Account aktivieren

Laufzeit des Kurses

ca. 9,5 Stunden

Benötigte Vorkenntnisse

HTML/CSS/JavaScript Kenntnisse

Next.js ist das React Fullstack Framework für moderne Webanwendungen, mit welchem du jedes beliebige Webprojekt umsetzen kannst. Es ist das so ziemlich Modernste, was die Webentwicklung zur Zeit bietet.

Aus diesem Grund verwundert es nicht, dass zahlreiche bekannte Firmen, wie z.B. Netflix, Nike, Twitch oder Tiktok ihre Webanwendungen bereits mit Next.js entwickeln.

Im Kurs lernst du den Umgang mit dem Next.js Framework von 0 an und Schritt-für-Schritt kennen, sodass du danach in der Lage bist, deine eigenen Webanwendungen umzusetzen.

Genauer gesagt wirst du lernen:

  • Was das Next.js Framework überhaupt ist
  • Wie man alle notwendigen Installationen Schritt-für-Schritt durchführt
  • Alle notwendigen React Grundlagen
  • Alle notwendigen Next.js Grundlagen
  • Datenbankanbindung uvm.

All diese Kenntnisse wirst du im Anschluss "hands-on" mithilfe eines umfassenden Praxisprojekts vertiefen, denn wir programmieren eine reale und funktionsfähige Next.js Fullstack Webanwendung, über welche Nutzer Essen bestellen können.

Wenn du also deinen JavaScript Wissensstand und somit deine Karriere als Softwareentwickler auf das nächste Level heben möchtest, um so in zukünftigen Bewerbungsgesprächen oder im Joballtag massiv zu punkten, solltest du diesen Kurs definitiv durcharbeiten.

Jetzt deinen Premium Account aktivieren


Inhaltsverzeichnis des Kurses

Modul 1: Einführung

next.js kurs modul 1

In diesem Modul erhältst du eine detaillierte Einführung in diesen Kurs. Du wirst dabei lernen, was Next.js ist und wie der Kurs grundsätzlich aufgebaut ist.

Diese Lektionen erwarten dich:

  • [Text] Kursübersicht und Voraussetzungen
  • [Video 1] Einstieg in Next.js
  • [Video 2] Lehrplan
  • [Video 3] Was ist Next.js

Modul 2: Installation

next.js kurs modul 2

In diesem Modul werden wir gemeinsam alle notwendigen Installationen Schritt-für-Schritt durchführen, sodass du den Kurs problemlos durcharbeiten kannst.

Diese Lektionen erwarten dich:

  • [Video 1] Voraussetzungen
  • [Video 2] Windows Installation
  • [Video 3] Linux Installation

Modul 3: React Grundlagen

next.js kurs modul 3

Da Next.js auf dem React Framework aufbaut, wirst du in diesem Modul alle notwendigen React Grundlagen der Reihe nach kennenlernen. Wir starten dabei komplett bei 0, sodass du keinerlei Vorwissen in diesem Framework benötigst.

Diese Lektionen erwarten dich:

  • [Video 1] Das ist React
  • [Video 2] React Projektstruktur
  • [Video 3] Eigene React App
  • [Video 4] JSX
  • [Video 5] Komponenten und Props
  • [Video 6] CSS Styling
  • [Video 7] States
  • [Video 8] React Zwischenfazit

Modul 4: Next.js Grundlagen

next.js kurs modul 4

In diesem Modul wirst du alle notwendigen Next.js Grundlagen von Beginn an kennenlernen. Dadurch wirst du dazu befähigt, dass wir im nächsten Modul gemeinsam eine komplette und voll funktionsfähige Next.js Webanwendung umsetzen können. 

Diese Lektionen erwarten dich:

  • [Video 1] Next.js Installation
  • [Video 2] Next.js Projektstruktur
  • [Video 3] Routing
  • [Video 4] Navigation
  • [Video 5] CSS Styling und Layout
  • [Video 6] Render Arten: SSG
  • [Video 7] Render Arten: SSR und ISR
  • [Video 8] Image Optimization
  • [Video 9] APIs
  • [Video 10] Deployment
  • [Video 11] Next.js Zwischenfazit

Modul 5: Praxisprojekt - Reale Fullstack Next.js Webanwendung

next.js kurs modul 5

In diesem Modul werden wir gemeinsam eine reale Fullstack Next.js Webanwendung umsetzen. Wir entwickeln eine Webanwendung, über welche sich Nutzer essen bestellen können. Das Projekt wird dich dazu befähigen, dass du zukünftig auch eigene Webanwendungen mit Next.js umsetzen kannst.

Diese Lektionen erwarten dich:

  • [Video 1] Vorstellung des Praxisprojekts
  • [Video 2] Projekt Setup
  • [Video 3] SASS Header
  • [Video 4] Carousel
  • [Video 5] Produkte anlegen
  • [Video 6] Produktseiten erstellen
  • [Video 7] Warenkorb und Bestellstatus
  • [Video 8] Datenbank Installation
  • [Video 9] Datenbank Verbindung
  • [Video 10] Daten speichern (API)
  • [Video 11] Produktdaten auslesen
  • [Video 12] Preise aktualisieren
  • [Video 13] Produkte in den Warenkorb
  • [Video 14] Warenkorb aktualisieren
  • [Video 15] Paypal Bezahlung
  • [Video 16] Bestellungen speichern
  • [Video 17] Bestellübersicht
  • [Video 18] Admin Backend
  • [Video 19] Datensätze entfernen
  • [Video 20] BestellungSchema ergänzen
  • [Video 21] Admin Login Seite
  • [Video 22] Admin Authentifizierung
  • [Video 23] Design Anpassungen
  • [Video 24] Page Transitions
  • [Video 25] MongoDB online
  • [Video 26] Deployment und Hosting
  • [Video 27] Schlussworte
Jetzt deinen Premium Account aktivieren