Wie erstellt man eine Next.js App mit Yarn?

Melden
  1. Voraussetzungen
  2. Neues Next.js Projekt mit Yarn anlegen
  3. Projekt starten und Entwicklung
  4. Fazit

Next.js ist ein beliebtes React-Framework, das das Erstellen von serverseitig gerenderten Anwendungen und statischen Webseiten erleichtert. Wenn du mit Yarn arbeitest, dem alternativen Paketmanager zu npm, kannst du eine Next.js Applikation schnell und einfach einrichten. Im Folgenden erkläre ich dir Schritt für Schritt, wie du eine Next.js App mit Yarn erstellst.

Voraussetzungen

Bevor du beginnst, solltest du sicherstellen, dass Node.js und Yarn auf deinem System installiert sind. Node.js benötigt du, damit JavaScript außerhalb des Browsers ausgeführt werden kann. Yarn ist ein Paketmanager, der dir hilft, Abhängigkeiten schneller und verlässlicher zu verwalten als npm. Sollten sie noch nicht installiert sein, kannst du Node.js von der offiziellen Webseite herunterladen und Yarn über die Kommandozeile installieren.

Neues Next.js Projekt mit Yarn anlegen

Um eine neue Next.js App zu erstellen, benutzt man üblicherweise das offizielle Create Next App Tool, das auch mit Yarn funktioniert. Öffne zunächst dein Terminal und navigiere in das Verzeichnis, in dem du das Projekt erstellen möchtest. Dort führst du den Befehl yarn create next-app gefolgt vom Namen deiner App aus. Zum Beispiel:

yarn create next-app meine-next-app

Dieser Befehl lädt die Vorlage für eine Next.js App herunter, installiert die notwendigen Abhängigkeiten und richtet das Grundgerüst automatisch ein. Alternativ kannst du den Befehl auch mit zusätzlichen Optionen verwenden, um zum Beispiel TypeScript direkt zu integrieren oder Template-Vorlagen zu wählen.

Projekt starten und Entwicklung

Nachdem deine Next.js App erstellt wurde, navigiere in das neue Verzeichnis mit cd meine-next-app. Dort kannst du die Dev-Umgebung starten, indem du yarn dev ausführst. Next.js startet einen Entwicklungsserver, der standardmäßig auf http://localhost:3000 erreichbar ist. Änderungen, die du an deinen Dateien vornimmst, werden automatisch erkannt und im Browser aktualisiert.

Fazit

Das Erstellen einer Next.js Applikation mit Yarn ist unkompliziert und schnell erledigt. Indem du das Kommando yarn create next-app nutzt, hast du innerhalb von wenigen Minuten ein vollständig eingerichtetes Projekt. Die Kombination aus Next.js und Yarn stellt eine moderne und effiziente Entwicklungsumgebung dar, die dir dabei hilft, leistungsfähige React-Anwendungen mit serverseitigem Rendering zu bauen.

0

Kommentare