Beispielanwendung

Wir haben eine kleine Anwendung erstellt, die das Wetter aufzeichnet und die Ergebnisse auf einer einfachen Seite anzeigt. Du kannst die Anwendung auf GitHub finden. Du kannst sie gerne zum Testen verwenden, aber bitte verlasse dich nicht auf sie, wenn du sie in der Produktion einsetzt. Der Zweck der Anwendung ist es, den Einsatz von Kinsta zu testen.

Forken der Beispielanwendung

Besuche zunächst die Anwendung weatherlogger-js auf GitHub und lese die enthaltene Readme-Datei, um mehr über die Anwendung zu erfahren. Wenn du dich mit der Anwendung vertraut gemacht hast, klicke auf die Schaltfläche Fork oben rechts, um sie in deinem eigenen GitHub-Konto zu forken.

Erstelle einen Fork von weatherlogger-js auf GitHub.
Erstelle einen Fork von weatherlogger-js auf GitHub.

Erstelle einen API-Schlüssel

Die App benötigt einen API-Schlüssel von OpenWeather. Sobald du dich angemeldet hast, kannst du dich einloggen und einen kostenlosen API-Schlüssel erstellen, mit dem du täglich 1.000 API-Aufrufe tätigen kannst. Wir empfehlen, diesen Schritt zuerst zu machen, da es 10-20 Minuten dauert, bis der API-Schlüssel aktiv wird. Diese Zeit können wir nutzen, um unsere Anwendung einzurichten.

Verarbeitet

Wenn wir die Anwendung auf Kinsta bereitstellen, müssen wir zwei Prozesse ausführen:

  • Ein Webserver, auf dem wir unsere Wetterdaten ansehen können. Dieser kann mit dem Befehl npm start gestartet werden.
  • Ein Cronjob, der alle paar Minuten Wetterdaten sammelt. Dieser kann mit dem Befehl npm run weatherLogger gestartet werden

Beginnen wir mit den Vorbereitungen für die Ausführung dieser Prozesse.

Eine Datenbank bereitstellen

Vergewissere dich in MyKinsta, dass du dich auf der Seite Anwendungen befindest, klicke auf Dienst hinzufügen und wähle dann Datenbank im Dropdown-Menü. Wir haben die folgenden Werte in das Formular eingegeben, um unsere Beispieldatenbank zu erstellen:

  • Datenbankname: weatherloggerdb
  • Anzeigename: Wetterlogger-Datenbank
  • Datenbanktyp: MySQL
  • Version: 8.0
  • Wir haben den Benutzernamen und das Passwort der Datenbank nicht verändert
  • Standort des Rechenzentrums: us-east4-a
  • Datenbankgröße: 2 CPU-Kerne – 512 MB RAM (Mini)

Klicke auf die Schaltfläche Datenbank erstellen und du solltest fertig sein.

Erstellen einer neuen Datenbank für unsere Beispielanwendung.
Erstellen einer neuen Datenbank für unsere Beispielanwendung.

Eine Anwendung bereitstellen

Vergewissere dich, dass du dich auf der Seite Anwendungen befindest, klicke auf Dienst hinzufügen und wähle dann Anwendung im Dropdown-Menü. Wenn du auf das Feld GitHub-Repository klickst, musst du Kinsta erlauben, mit deinem Repository zu interagieren.

Eine Videoanleitung findest du in unseren Video-Tutorials. Weitere Schritt-für-Schritt-Anleitungen findest du unter Eine Anwendung hinzufügen.

Wir haben die folgenden Werte in das Formular eingegeben, um unsere Beispielanwendung zu erstellen:

  • GitHub-Repository: danielpataki/weatherlogger-js (in deinem Fall wird das etwas wie your-organization/weatherlogger-js sein)
  • Standard-Zweig: main
  • Automatisches Deployment bei Commit: nicht markiert
  • Laufzeitumgebung: Lass Kinsta die Laufzeitumgebung festlegen
  • Anwendungsname: Weather Logger
  • Standort des Datenzentrums: us-east4-a

Klicke auf Anwendung hinzufügen und der Bereitstellungsprozess wird gestartet.

Wir erstellen eine neue Anwendung für unser Beispiel.
Wir erstellen eine neue Anwendung für unser Beispiel.

Verbinden von Anwendung und Datenbank

Sobald die Datenbank für Verbindungen bereit ist (ein grünes Häkchen wird daneben angezeigt), können wir sie mit unserer Anwendung verbinden, auch wenn die Anwendung noch im Einsatz ist. Klicke auf die Anwendung Weather Logger, klicke in der Seitenleiste auf Einstellungen und scrolle nach unten, um den Abschnitt Interne Verbindungen zu finden.

Interne Verbindungen in unserer Beispielanwendung.
Interne Verbindungen in unserer Beispielanwendung.

Klicke auf Verbindung hinzufügen und wähle in dem sich öffnenden Pop-up-Fenster die Weather Logger Database aus. Aktiviere das Kontrollkästchen Umgebungsvariablen für den Zugriff auf die Datenbank hinzufügen, scrolle zum unteren Ende des Fensters und klicke auf Verbindung hinzufügen.

Füge eine interne Verbindung für unsere Beispielanwendung hinzu.
Füge eine interne Verbindung für unsere Beispielanwendung hinzu.

Anwendung einrichten

Als Nächstes müssen wir alle Informationen, die unsere Anwendung benötigt, in Form von Umgebungsvariablen hinzufügen. Die meisten Informationen wurden im vorherigen Schritt automatisch hinzugefügt, indem die Variablen für die Datenbankverbindung ausgefüllt wurden.

Das Einzige, was noch fehlt und von der Anwendung benötigt wird, ist der OpenWeatherMap API-Schlüssel. In den Einstellungen, direkt unter dem Abschnitt Interne Verbindungen, findest du den Abschnitt Umgebungsvariablen. Klicke auf Umgebungsvariable hinzufügen und verwende OPENWEATHER_KEY als Schlüssel und deinen API-Schlüssel als Wert.

Füge deinen OpenWeather API-Schlüssel zu den Umgebungsvariablen hinzu.
Füge deinen OpenWeather API-Schlüssel zu den Umgebungsvariablen hinzu.

Die Anwendung unterstützt noch ein paar weitere Variablen zur Steuerung der Aktualisierungshäufigkeit, der verwendeten Einheiten usw. Weitere Informationen findest du in der Dokumentation der Anwendung.

Konfigurieren von Prozessen

Wir haben eingangs erwähnt, dass wir einen Webserver und einen Cronjob brauchen. Im Abschnitt Prozesse der Anwendung siehst du, dass ein Webprozess automatisch erstellt wird und standardmäßig unter npm start läuft – genau das, was wir brauchen.

Um den Cronjob einzurichten, klickst du auf die Schaltfläche Prozess erstellen und füllst das Formular in dem daraufhin erscheinenden Modal/Pop-up aus. Wir haben für unser Beispiel die folgenden Werte verwendet:

Name: Worker
Typ: Hintergrundjob
Startbefehl npm run weatherLogger
Pod Größe: nano
Instanzen: 1

Klicke dann auf die Schaltfläche Prozess erstellen.

Erstelle den Hintergrundprozess für unsere Beispielanwendung.
Erstelle den Hintergrundprozess für unsere Beispielanwendung.

Die Anwendung bereitstellen

Zum Schluss gehst du zurück zum Abschnitt Bereitstellungen und klickst auf die Schaltfläche Jetzt bereitstellen. Der Einsatz dauert in der Regel etwa 90 Sekunden, aber es kann sein, dass du etwas länger warten musst, bis alle Prozesse richtig in Gang gekommen sind. Deine erste Wettermessung sollte ein paar Minuten später aufgezeichnet werden. Um zu überprüfen, ob alles funktioniert, wirf einen Blick in den Bereich Logs.

Laufzeitprotokolle für die Beispielanwendung.
Laufzeitprotokolle für die Beispielanwendung.

Nach ein paar Minuten solltest du erfolgreiche Prozesse in den Runtime-Protokollen sehen. Im Beispielbild oben zeigt Zeile 243, dass der Logger seine Arbeit aufgenommen hat (Starting weather logging), und Zeile 244, dass der Webserver läuft (Weather server is up and running). Ab Zeile 245 werden zwei Logging-Ereignisse angezeigt (Weather data retrieved).

Wenn du zurück zum Abschnitt Einsätze gehst, solltest du die URL für den letzten Einsatz sehen. Klicke auf diese URL, um zu der Seite zu gelangen, die vom Webservice bereitgestellt wird:

Wetterlogger-Seite mit Wettereinträgen.
Wetterlogger-Seite mit Wettereinträgen.