Een statische site opzetten met Cuttlebelle op Kinsta

Dit is een voorbeeld van hoe je een Cuttlebelle applicatie instelt om met Kinsta’s Applicatie Hosting of Statische Site Hosting diensten te deployen vanuit een GitHub repository.

Cuttlebelle is een statische sitebouwer die elke pagina opdeelt in contentblokken die je later kunt samenvoegen om verschillende pagina-indelingen te maken zonder dat je complexe code hoeft te begrijpen of te gebruiken. Meer informatie is beschikbaar op de website van Cuttlebelle.

Kinsta installeert automatisch dependencies die zijn gedefinieerd in je composer.json bestand tijdens het deploymentproces.

Statische Site Hosting

1. Log in op GitHub en maak een nieuwe repository vanuit deze template (Gebruik deze template > Create a new repository): Kinsta – Hello World – Statische Site With Cuttlebelle.
2. Voeg in MyKinsta een statische site toe met de Hello World Cuttlebelle repository en de volgende Build instellingen:
   • Build commando: npm run build
   • Node versie: 18.16.0
   • Publish directory: .site
3. De app is beschikbaar zodra de build is voltooid en de Kinsta welkomstpagina wordt geladen op de URL van je applicatie.

Applicatie Hosting

1. Log in op GitHub en maak een nieuwe repository aan vanuit deze template (Use this template> Create a new repository): Kinsta – Hello World – Statische site met Cuttlebelle.
2. Voeg in MyKinsta een applicatie toe met de Hello World Cuttlebelle repository. Het Start commando kan leeg gelaten worden voor het webproces, omdat Kinsta automatisch het vereiste commando detecteert tijdens de eerste deployment.
3. De app is beschikbaar zodra de build is voltooid en de Kinsta welkomstpagina wordt geladen op de URL van je applicatie.

Instellingen webserver

Poort

Kinsta stelt automatisch de PORT omgevingsvariabele in. Je moet deze niet zelf definiëren of hard coderen in de applicatie. Het serve pakket gebruikt automatisch de door Kinsta ingestelde poort.

Start commando

Wanneer je een applicatie implementeert, maakt Kinsta automatisch een webproces aan met npm start als startcommando. Zorg ervoor dat je dit commando gebruikt om je server te starten.

Deployment levenscyclus

Telkens als een deployment wordt gestart (door een applicatie te maken of opnieuw te deployen vanwege een inkomende commit), wordt het npm build commando uitgevoerd, gevolgd door het npm start commando.

Welkomstpagina

De app of site is beschikbaar zodra het bouwen is voltooid en de Kinsta welkomstpagina wordt geladen op de URL van je applicatie of statische site.