Next.js

Dit is een voorbeeld van hoe je een statische site kunt opzetten met Next.js op Kinsta’s Statische Site Hosting vanuit een GitHub repository.

Next.js is het React Framework voor het web. Meer informatie is beschikbaar op de nextjs.org website.

Je kunt deze Quickstart templates ook gebruiken op Kinsta’s Applicatie Hosting zonder extra configuratie. Als je Applicatie Hosting gebruikt, kun je het Start commando leeg laten voor het webproces, omdat Kinsta automatisch het vereiste commando detecteert tijdens de eerste deployment.

Vereisten

  • Kinsta’s Quickstart templates worden opgeslagen en beheerd in GitHub; daarom heb je een GitHub account nodig om ze te openen.
  • Je moet een MyKinsta account aanmaken om de applicatie te deployen.

Een Next.js statische site deployen

  1. Log in op GitHub en maak een nieuwe repository van deze template (Use this template > Create a new repository): Kinsta – Hello World – Static Site With Next.js.
  2. Klik in MyKinsta op Statische sites > Site toevoegen > selecteer GitHub, klik op Verbind git provider > Autoriseren, en log in op je GitHub account.
  3. Kies de Hello World Next.js repository, klik op Doorgaan, en voer het volgende in bij de Build instellingen:
    • Build commando: npm run build
    • Node versie: 16.20.0
    • Publish directory: out

Tijdens het deploymentproces installeert Kinsta automatisch de dependencies die zijn gedefinieerd in je package.json bestand. De site is beschikbaar zodra de deployment is voltooid en de standaard Next.js pagina wordt geladen op de URL van je site.

Next.js default page after successful deployment of Next.js.
Next.js standaardpagina na succesvolle deployment van Next.js.

Deployment levenscyclus

Wanneer een deployment wordt gestart (door het maken van een statische site of door het opnieuw deployen als gevolg van een inkomende commit), wordt het build commando uitgevoerd, gevolgd door de deployment van de Publish Directory inhoud.

Was dit artikel nuttig?