In deze handleiding zullen we de stappen doorlopen om een voorbeeldapplicatie en -database te deployen. Voel je vrij om de voorbeeldapplicatie hieronder te gebruiken om te testen, maar gebruik deze alsjeblieft niet voor gebruik in een live productieomgeving. Het doel van de applicatie is om de deployment van Kinsta te testen.

Voorbeeldapplicatie

We hebben een kleine applicatie gemaakt om het weer te loggen en de resultaten op een eenvoudige pagina weer te geven. Je kunt de applicatie vinden op GitHub.

Fork de voorbeeldapplicatie

Bezoek eerst de applicatie weatherlogger-js op GitHub en lees het bijgeleverde Readme bestand om meer over de applicatie te weten te komen. Als je er vertrouwd mee bent geraakt, klik je op de Fork knop rechtsboven om hem naar je eigen GitHub account te forken.

Maak een vork van weatherlogger-js in GitHub.
Maak een vork van weatherlogger-js in GitHub.

Maak een API sleutel

De app vereist een API sleutel van OpenWeather. Zodra je je aanmeldt, kun je inloggen en gratis een API sleutel aanmaken waarmee je dagelijks 1.000 API aanroepen kunt doen. We raden aan deze stap eerst te doen, want het duurt 10-20 minuten voor de API sleutel actief wordt, die we kunnen besteden aan het opzetten van onze applicatie.

Verwerkingen

Bij het inzetten van de toepassing op Kinsta moeten we twee processen uitvoeren:

  • Een webserver waar we onze weergegevens kunnen bekijken. Deze kan gestart worden met het npm start commando.
  • Een cronjob die om de paar minuten weergegevens verzamelt. Deze kan gestart worden met het npm run weatherLogger commando

Laten we beginnen met de dingen klaar te maken om die processen uit te voeren.

Een database aanmaken

Zorg dat je in MyKinsta op de pagina Applicaties bent, klik op Service toevoegen en kies dan Database in het keuzemenu. We gebruikten de volgende waarden in het formulier om onze voorbeelddatabase te maken:

  • Databasenaam: weatherloggerdb
  • Weergavenaam: Weather Logger Database
  • Databasetype: MySQL
  • Versie: 8.0
  • We hebben de gebruikersnaam en het wachtwoord van de Database ongemoeid gelaten
  • Datacenterlocatie: us-central1
  • Databasegrootte: 0.25 CPU / 256 MB RAM (Mini)

Klik op Database aanmaken, en je bent klaar.

Een nieuwe database maken voor onze voorbeeldtoepassing.
Een nieuwe database maken voor onze voorbeeldtoepassing.

Een applicatie maken

Zorg dat je op de pagina Applicaties bent, klik op Service toevoegen, kies dan Applicatie in het keuzemenu. Als je op het GitHub repository veld klikt, moet je Kinsta toestaan met je repository te interageren.

Voor meer stap-voor-stap documentatie, zie Een applicatie toevoegen.

Wij gebruikten de volgende waarden in het meerdelige formulier om onze voorbeeldapplicatie te maken:

Details van de applicatie

  • GitHub repository: danielpataki/weatherlogger-js (in jouw geval zal dat iets zijn als jouw-organisatie/weatherlogger-js)
  • Standaard branch: main
  • Automatische deployment bij commit: niet aangevinkt
  • Naam van de toepassing: Weerlogger
  • Datacenter locatie: us-central1
Een nieuwe applicatie maken voor ons voorbeeld.
Een nieuwe applicatie maken voor ons voorbeeld.

Build omgeving

  • Build resources: Standard
  • Build environment: Set up container image automatically
De buildomgeving configureren voor ons voorbeeld.
De buildomgeving configureren voor ons voorbeeld.

Resources

  • Stel je processen in:
    • Procesnaam: Webproces
    • Procestype: web
    • Startcommando: npm start
    • Podgrootte: Standaard 0.5 CPU / 1 GB RAM
    • Aantal instances: 1

Klik op Applicatie toevoegen en het deploymentproces wordt gestart.

Inrichten van het webproces voor onze voorbeeldapplicatie.
Inrichten van het webproces voor onze voorbeeldapplicatie.

Betaalmethode

Bekijk het voorbeeld van de maandelijkse verbruikskosten van de applicatie en bevestig je betalingsmethode.

Bevestiging van de betalingsmethode voor onze voorbeeldapplicatie.
Bevestiging van de betalingsmethode voor onze voorbeeldapplicatie.

Verbinden van de applicatie en de database

Als de database klaar is voor verbindingen (er staat een groen vinkje naast), kunnen we hem aan onze toepassing koppelen, ook al is de toepassing nog aan het uitrollen. Klik op de toepassing Weather Logger, klik op Instellingen in de zijbalk, en scroll naar beneden om de sectie Interne verbindingen te vinden.

Interne verbindingen in onze voorbeeldapplicatie.
Interne verbindingen in onze voorbeeldapplicatie.

Klik op Verbinding toevoegen, en kies in het modal/popup venster dat verschijnt de Weather Logger Database. Vink het vakje Omgevingsvariabelen toevoegen om toegang te krijgen tot de database aan, vink de vakjes Beschikbaar tijdens runtime en Beschikbaar tijdens bouwproces aan, en klik op Verbinding toevoegen.

Een interne verbinding toevoegen voor onze voorbeeldapplicatie.
Een interne verbinding toevoegen voor onze voorbeeldapplicatie.

Instellingen van de applicatie

Het volgende op onze lijst is het toevoegen van alle informatie die onze applicatie nodig heeft in de vorm van omgevingsvariabelen. De meeste informatie werd in de vorige stap automatisch toegevoegd door de variabelen voor de databasekoppeling in te vullen.

De enige die ontbreekt en die de applicatie nodig heeft is de OpenWeatherMap API sleutel. In de Instellingen, net onder het onderdeel Interne verbindingen, zie je het onderdeel Omgevingsvariabelen. Klik op Omgevingsvariabele toevoegen en gebruik OPENWEATHER_KEY als sleutel en je API sleutel als waarde.

Voeg je OpenWeather API sleutel toe aan de omgevingsvariabelen.
Voeg je OpenWeather API sleutel toe aan de omgevingsvariabelen.

De toepassing ondersteunt nog een paar andere variabelen om de updatefrequentie, gebruikte eenheden, enz. te regelen. Kijk in de documentatie van de toepassing voor meer informatie.

Processen instellen

We vermeldden in het begin dat we een webserver en een cronjob nodig zullen hebben. Ga naar de sectie Processen van de applicatie, en je ziet het webproces dat npm start uitvoert dat we hebben aangemaakt bij het toevoegen van de applicatie.

Om de cronjob in te stellen klik je op de knop Proces aanmaken en vul je het formulier in de modal/popup die verschijnt. We gebruikten de volgende waarden voor ons voorbeeld:

Naam: Worker
Type: Background job
Start commando: npm run weatherLogger
Pod grootte: Standaard 0.5 CPU / 1 GB RAM
Instanties: 1

Klik dan op de knop Creëer proces.

Het achtergrondproces aanmaken voor onze voorbeeldapplicatie.
Het achtergrondproces aanmaken voor onze voorbeeldapplicatie.

De applicatie deployen

Ga tenslotte terug naar het onderdeel Deployments en klik op de knop Nu deployen. Het deployen duurt meestal ongeveer 90 seconden, maar het kan zijn dat je iets langer moet wachten tot alle processen goed op gang komen. Je eerste weermeting zou een paar minuten daarna gelogd moeten worden. Om te controleren of alles werkt, kijk je in de sectie Logs.

Runtime logs voor de voorbeeldtoepassing.
Runtime logs voor de voorbeeldtoepassing.

Na een paar minuten zou je succesvolle processen moeten zien in de Runtime logs. In de voorbeeldafbeelding hierboven zie je op regel 482 dat de logger begonnen is te werken (Starting weather logging), en op regel 483 dat de webserver draait (Weather server is up and running). Vanaf regel 245 zijn er logboekgebeurtenissen (Weather data retrieved).

Bovenaan de pagina zie je de URL van je applicatie (deze is ook te vinden op de pagina Deployments onder Nieuwste deployment). Klik op deze URL om naar de pagina gebracht te worden die door de webservice geleverd wordt:

Pagina weerlogger die weerberichten toont.
Pagina weerlogger die weerberichten toont.