Dies ist ein Beispiel dafür, wie du eine statische Website mit Next.js auf dem statischen Seiten Hosting Diensten von Kinsta aus einem GitHub-Repository einrichtest.

Next.js ist das React Framework für das Web. Weitere Informationen findest du auf der Website nextjs.org.

Du kannst diese Schnellstartvorlage auch auf dem Anwendungs-Hosting von Kinsta ohne zusätzliche Konfiguration verwenden. Wenn du Anwendungs-Hosting nutzt, kannst du den Start-Befehl für den Webprozess leer lassen, da Kinsta den erforderlichen Befehl bei der ersten Bereitstellung automatisch erkennt.

Während des Bereitstellungs-Prozesses installiert Kinsta automatisch die in deiner package.json-Datei definierten Abhängigkeiten.

  1. Melde dich bei GitHub an und erstelle ein neues Repository aus dieser Vorlage (Diese Vorlage verwenden > Neues Repository erstellen): Kinsta – Hello World – Statische Seite mit Next.js
  2. Füge in MyKinsta eine statische Site mit dem Hello World Next.js-Repository hinzu. Die Build-Einstellungen werden möglicherweise automatisch ausgefüllt; überprüfe, ob sie mit den folgenden übereinstimmen und ändere sie bei Bedarf:
    • Build-Befehl: npm run build
    • Node Version: 16.20.0
    • Veröffentlichungsverzeichnis: out
  3. Sobald der Build abgeschlossen ist, ist die Seite verfügbar und die Standard Next.js Seite wird unter der URL deiner Seite geladen.
Next.js-Standardseite nach erfolgreicher Bereitstellung von Next.js
Next.js-Standardseite nach erfolgreicher Bereitstellung von Next.js

Lebenszyklus der Bereitstellung

Immer wenn eine Bereitstellung initiiert wird (durch die Erstellung einer statischen Website oder eine erneute Bereitstellung aufgrund eines eingehenden Commits), wird der Build-Befehl ausgeführt, gefolgt von der Bereitstellung der Inhalte des Veröffentlichungsverzeichnisses.