© saicle/Shutterstock.com
Das Framework Next.js bietet hilfreiche Erweiterungen für React

Erweiterter Horizont


Bei der Arbeit mit React stolpert man früher oder später über Frameworks, die Werkzeuge für Entwickler bereitstellen. Eins dieser Werkzeuge ist Next.js, ein React Framework. Und hier stellt sich schon die erste Frage: Warum brauchen wir ein Framework, das auf einer Bibliothek basiert? Die Antwort hierauf ist eigentlich relativ einfach: Next.js reichert den Funktionsumfang von React um zusätzliche Features an.

Eines der wichtigsten Features von Next.js ist das Server-side Rendering (SSR). React selbst bietet hierfür zwar die Grundlagen, überlässt die konkrete Implementierung jedoch den Entwicklern einer Applikation. Neben SSR erlaubt Next.js außerdem dateibasiertes Routing und Code-Splitting. Alles Optimierungen, die eine rein clientseitige Lösung nicht leisten kann. Und so behauptet Next.js von sich selbst, das passende Framework für eine ganze Reihe von Problemstellungen zu sein, darunter befinden sich beispielsweise statische Webseiten, mobiles Web, PWA und Electron.

Bevor wir uns näher mit Next.js und seinen Features beschäftigen, werfen wir noch kurz einen Blick auf das Ökosystem um das Framework herum, um es besser einordnen zu können. Das Erste, mit dem sich Next.js vergleichen lässt, ist React selbst. React ist als Bibliothek für Benutzerschnittstellen entwickelt und wird als solche direkt im Browser ausgeführt. React stellt die grundlegenden Bausteine für eine komponentenbasierte Architektur zur Verfügung. React arbeitet mit weiteren Werkzeugen wie webpack und Babel, um aus vielen Quellcodedateien eine beziehungsweise wenige optimierte Dateien zu erzeugen, die zum Benutzer ausgeliefert werden. Eine solche React-Applikation wird zwar auf der Kommandozeile gebaut, aber dann statisch über einen Webserver ausgeliefert. Next.js nutzt die Möglichkeiten von React und erweitert sie um eine Reihe von Features. Hierfür wird ein Node.js-Prozess serverseitig ausgeführt, der die Applikation optimiert und zahlreiche Erweiterungen erst ermöglicht. Dieser Prozess wird über die gesamte Laufzeit der Applikation ausgeführt und nicht nur zum Zeitpunkt des Builds. Ein weiteres Werkzeug, das im Zusammenhang mit React-Applikationen immer wieder genannt wird, ist Gatsby. Im Kern handelt es sich hierbei um einen Generator für statische Webseiten. Das bedeutet, dass Gatsby nur während der Entwicklung und zum Bauen der Applikation, nicht aber während der Laufzeit verwendet wird. Die Erzeugung statischer Seiten ist auch mit Next.js möglich, das ist jedoch nicht das Hauptein...

Neugierig geworden?

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang