Next.js - Das React Framework für moderne Webanwendungen

Dein Einstieg in die Entwicklung dynamischer Webanwendungen mit React und NextJS

4.45 (165 reviews)
Udemy
platform
Deutsch
language
Web Development
category
instructor
1,040
students
9.5 hours
content
Mar 2024
last update
$54.99
regular price

What you will learn

✨ Du lernst die kompletten Grundlagen von React und Nextjs

🎉 Du lernst wie du eigene Projekte installierst und einrichtest

🚀 Du wirst eine voll funktionsfähige, reale Webanwendung mit React und Nextjs entwickeln

🔥 Du lernst das Routing und die Navigation deiner Webanwendung

💥 Du lernst die Verwendung von zahlreichen weiteren Javascript Bibliotheken und NPM Paketen

🌏 Du wirst in der Lage sein, deine eigenen Webanwendung zu kompilieren und im Web zu veröffentlichen

💽 Du lernst die Nutzung von lokalen und Cloud Datenbanken

📟 Du lernst den Einsatz von API Endpoints

💳 Du wirst Paypal intrigieren um echte Zahlung abzuwickeln

🎥 Du lernst die Transitions für Animationen kennen

🧮 Du lernst die Grundlagen von States und Redux

💈Du lernst dein Design mit CSS und SASS anzupassen

Description

Du möchtest moderne, dynamische Full Stack Webanwendungen mit Frontend und Backend in Javascript entwickeln, die im Funktionsumfang keine Wünsche offen lassen?

Dann bist du in diesem Kurs genau richtig!

Herzlich Willkommen zum Next.js Kurs! Next.js ist genau das React Full Stack Framework das du brauchst, um alles zu entwickeln das du dir vorstellen kannst. Von einfachen Webseiten bis hin zu hochkomplexen Webanwendungen und Onlineshops die maximal Skalierbar sind, ist mit Next.js quasi alles möglich.

React Full Stack Framework bedeutet, dass Next.js auf React aufbaut und du damit sowohl das Frontend als auch das Backend erstellen kannst. React kümmert sich um das Frontend und Next.js ergänzt das Backend um zusätzliche nützliche Funktionen. In diesem Kurs lernst du somit also nicht nur ein, sondern gleich zwei Javascript Frameworks. Im Funktionsumfang für deine Webprojekte sind dir damit keine Grenzen gesetzt.

Zahlreiche große Firmen haben das Potential und die Möglichkeiten erkannt und ihre Webseiten auf Next.js umgestellt. Bekannte Beisiele sind Netflix, Nike, Ferrari, Twitch, TikTok, Github, Coinbase, Binance oder Uber. Und noch viele mehr.

Außerdem ist React allein nach wie vor das angesagteste Javascript Framework für für die Entwicklung von Frontend User Interfaces, für die es die meisten Stellenausschreibungen gibt. Sollte dein Ziel die berufliche Weiterbildung oder ein neuer Job in der Webentwicklung sein, dann ist React in jedem Fall eine gefragte Fähigkeit. Und zusätzlich lernst du hier natürlich hauptächlich noch die Backendentwicklung mit Next.js!

Dieser Kurs bietet dir in über 9 Stunden alles was du wissen musst, um deine eigenen React und Next.js Projekte einzurichten, umzusetzen und moderne Webanwendungen für jeden Einsatzzweck zu erstellen. Wir starten hier komplett bei 0, du solltest aber Grundkentnisse in Javascript und HTML mitbringen.


Folgende Inhalte werden wir besprechen und an konkreten Code-Beispielen bearbeiten:

  • Die React und Next.js Grundlagen

  • JSX Syntax für die kompakte Entwicklung von React Komponenten

  • CSS und SASS Styling für die Erstellung des Frontends

  • State Management und Redux zur Verwaltung von globalen Zustandsänderungen der Variablen

  • Routing und Navigation der Webanwendung

  • Verschiedene Render Arten um deine Anwendung zum Beispiel serverseitig Vor-rendern zu lassen und damit die Suchmaschinenoptimierung zu verbessern

  • Image Optimierung für Lazy Loading Geräte optimierter Ausgabe von Bildern

  • API Endpoint um deine eigene Programmierschnittstelle zu entwickeln und anderen Dienste oder Webseiten anzubinden

  • Implementierung von realen Zahlungsoptionen wie Kreditkarte, SEPA oder Paypal

  • Datenbank Integration für die dauerhafte Speicherung, sowohl lokal als auch in der Cloud

  • Deployment zur Veröffentlichen von statischen Exports oder hochdynamischen productions builds

  • Benutzerauthentifizierung und Login um einzelne Teile der Webanwendung vor Zugriff zu schützen

  • Wir entwickeln ein vollständiges Webprojekt, von der ersten Zeile bis zum veröffentlichten Projekt im Internet

  • ..und noch vieles mehr das ich dir im Lehrplan und in den Lektionen vorstelle


Zu jedem Beispiel bekommst du den kompletten Code im Anhang zur Lektion als Download!

Wenn du jetzt Lust bekommen hast mehr über React und Next.js zu erfahren, freue ich mich darauf dich im Kurs begrüßen zu dürfen. Dann lass uns direkt anfangen! :)

Content

Einleitung

Einstieg in Next.js
Lehrplan
Was ist Next.js?

Installation

Voraussetzungen
Windows Installation
Linux Installation

React Grundlagen

Das ist React
React Projektstruktur
Eigene React App
JSX
Komponenten und Props
CSS Styling
States
React Zwischenfazit
React Quiz

Next.js Grundlagen

Next.js Installation
Next.js Projektstruktur
Routing
Navigation
CSS Styling und Layout
Render Arten: SSG
Render Arten: SSR und ISR
Image Optimization
APIs
Deployment
Next.js Zwischenfazit
Next.js Quiz

Next.js Webprojekt

Vorstellung
Projekt Setup
SASS Header
Carousel
Produkte anlegen
Produktseiten erstellen
Warenkorb und Bestellstatus
Datenbank Installation
Datenbank Verbindung
Daten speichern (API)
Produktdaten auslesen
Preise aktualisieren
Produkte in den Warenkorb
Warenkorb aktualisieren
Paypal Bezahlung
Bestellungen speichern
Bestellübersicht
Admin Backend
Datensätze entfernen
BestellungSchema ergänzen
Admin Login Seite
Admin Authentifizierung
Design Anpassungen
Page Transitions
MondoDB online
Deployment und Hosting
Schlussworte

Screenshots

Next.js - Das React Framework für moderne Webanwendungen - Screenshot_01Next.js - Das React Framework für moderne Webanwendungen - Screenshot_02Next.js - Das React Framework für moderne Webanwendungen - Screenshot_03Next.js - Das React Framework für moderne Webanwendungen - Screenshot_04

Reviews

Karsten
July 31, 2023
Guter praktisch orientierte Kurs mit einem kompakten Überblick und einen ansprechenden Projekt. Aktuell etwas hinter der aktuellen Version hinterher (next.js und paypal) was zu kleineren Inkonsistenzen führt, aber noch immer nachvollziehbar ist (F&A Bereich besuchen). Noch als Anregung: die Materialien sind ja inkrementell in den einzelnen Kursabschnitten bereitgestellt, evtl. wäre die Bereitstellung des finalen Projekts noch sinnvoll, damit man sich im Fehlerfall die gesamten Anwendung mal installieren und nachvollziehen kann.
Viktor
July 6, 2023
Für mich als Anfänger mit erster Erfahrung in JavaScript und Angular, war der Kurs bzw. das Liefermax Projekt schon sehr anspruchsvoll. Vor allem das Tempo und die Schlagzahl an neuen Librarys und neuen Syntaxen und Schreibweisen usw. ist schon sehr sehr hoch. Natürlich kann man jedes Video immer wieder ansehen, bis man es versteht, aber wenn gefühlt in jedem 15 Min. Video soviel neuer Input kommt, dann ist man als Anfänger nach dem 7. oder 8. in 2-3 Stunden ziemlich überfordert.
Hristos
May 31, 2023
Das fertige Web Projekt ist leider null responsive, was mit das wichtigste ist, meiner Meinung. Außerdem funktionieren die API endpunkte nicht in der deployeden app, weder das routing.
Sebastian
May 28, 2023
Nichtmal der Anfang hat geklappt ( Routing), Next.js ist mittlerweile auf einen ganz anderen Stand als in dem Kurs und der Kurs ist veraltet. Nicht zu empfehlen !!!
Jan
February 2, 2023
An sich gut erklärt, allerdings hätte ich gerne mehr Grundlagen (Middelware , Best Practice....) gelernt. Das Webprojekt ist für Einsteiger recht interessant, persönlich mag ich aber lieber die "Basics" lernen und begreifen.
Dieter
January 16, 2023
Es wird sehr ruhig und gut strukturiert durch die Themen geleitet. Ausgesprochen angenehme und deutliche Sprache erleichtert das verfolgen des Inhalts. Danke.
Oliver
January 14, 2023
Einer der besten Kurse, welche ich bisher bei Udemy gefunden habe. Der Dozent erinnert mich an Löwenzahn oder die Sendung mit der Maus - was ein Kompliment sein soll. Mit einer ruhigen und angenehmen Stimme werden alle Umsetzungsschritte im Detail erklärt. Das Kursbeispiel ist absolut praxisnah. Meiner Meinung nach ist der Kurs auch hervorragend für Programmierumsteiger (weniger für komplette Neulinge) geeignet. Aktuelle Tipps rund um die Entwicklung von Next.js runden den gesamten Kurs ab.
Graz
November 4, 2022
Grossartige Einführung in Next.js Die Gesamtheit des Kurses ist grossatig, angefangen bei der Erstellung des Frontends, übers Backend, Adminbereich mit Authorisierung, online Bezahlmöglichkeit und Deployment. Hat alles geklappt, danke nochmals für deine Mühe und den Inhalt. Habe definitiv mehr Value erhalten, als was der Kurs gekostet hat.
Thomas
November 2, 2022
Weil der Author ein gutes Tempo vorlegt, die Dinge gut erklärt, sauber und gleichmäßig und vor allem verständlich spricht.
Gregor
October 20, 2022
Wenn du schon etwas Erfahrung in node js und react hast, ist dies ein guter Kurs, um einen schnellen Einblick in Next.js zu erhalten. Danke!
Markus
September 21, 2022
Optimal von Schwierigkeit und Umfang her zum Einsteigen in die Materie! Viele interessante Themen aus der aktuellen Online Welt werden angesprochen und es wird aufgezeigt, wie man diese umsetzen kann. ?
Reiner
August 27, 2022
Einfach gesagt: Phantastisch!!! Alle Themen sind sehr kompetent, detailliert und verständlich vermittelt. Danke für die tolle Arbeit :-)
Eleonore
July 28, 2022
Der Kurs ist gut aufgebaut, verständlich erklärt, habe viel gelernt und konnte das Webprojekt ohne Schwierigkeiten umetzen. Hat Spaß gemacht!
Henri
June 29, 2022
Der Kurs ist sehr gut und ich habe sehr viel auch im Bereich Frontend gelernt nur kam ich beim Backend leider nicht weiter. Daher nicht so empfehlenswert für Programmier-Anfänger.
Martin
June 13, 2022
Top, genau was ich gesucht habe. Der Kurs ist super strukturiert und erklärt ausführlich die Grundlagen von React und Next mit vielen Praxisbeispielen zum mitmachen. Besonders im Projektteil lernt man dann wie alles zusammenhängt. Ich konnte die Beispiele problemlos nachbauen und gut verstehen. Kann den Kurs jedem empfehlen der ein Einsteig in die Webentwicklung mit React und Nextjs sucht.

Charts

Price

Next.js - Das React Framework für moderne Webanwendungen - Price chart

Rating

Next.js - Das React Framework für moderne Webanwendungen - Ratings chart

Enrollment distribution

Next.js - Das React Framework für moderne Webanwendungen - Distribution chart
4725874
udemy ID
6/9/2022
course created date
6/14/2022
course indexed date
Bot
course submited by