Dans ce guide, nous allons passer en revue les étapes de déploiement d’une application et d’une base de données d’exemple. N’hésitez pas à utiliser l’application d’exemple ci-dessous à des fins de test, mais ne vous y fiez pas pour une quelconque utilisation en production. Le but de l’application est de tester le déploiement de Kinsta.

Vous préférez regarder la version vidéo ?

Exemple d’application

Nous avons créé une petite application pour enregistrer la météo et afficher les résultats sur une page simple. Vous pouvez trouver l’application sur GitHub.

Forker l’application d’exemple

Tout d’abord, visitez l’application weatherlogger-js sur GitHub et lisez le fichier Readme inclus pour en savoir plus sur l’application. Une fois que vous vous êtes familiarisé avec elle, cliquez sur le bouton Fork en haut à droite pour la forker sur votre propre compte GitHub.

Créer un fork de weatherlogger-js dans GitHub.
Créer un fork de weatherlogger-js dans GitHub.

Créer une clé de l’API

L’application nécessite une clé de l’API d’OpenWeather. Une fois que vous vous êtes inscrit, vous pouvez vous connecter et créer gratuitement une clé de l’API qui vous permet de faire 1000 appels API par jour. Nous vous recommandons de faire cette étape en premier car il faut 10 à 20 minutes à la clé API pour devenir active, temps que nous pouvons passer à configurer notre application.

Processus

Lors du déploiement de l’application sur Kinsta, nous devons exécuter deux processus :

  • Un serveur web où nous pouvons visualiser nos données météorologiques. Il peut être démarré à l’aide de la commande npm start.
  • Un cronjob qui collecte les données météorologiques toutes les quelques minutes. Il peut être lancé à l’aide de la commande npm run weatherLogger

Commençons à préparer les choses pour exécuter ces processus.

Déployer une base de données

Dans MyKinsta, assurez-vous que vous êtes sur la page Applications, cliquez sur Ajouter un service, puis sélectionnez Base de données dans le menu déroulant. Nous avons utilisé les valeurs suivantes dans le formulaire pour créer notre base de données d’exemple :

  • Nom de la base de données : weatherloggerdb
  • Nom d’affichage : Weather Logger Database
  • Type de base de données : MySQL
  • Version : 8.0
  • Nous avons laissé intacts le nom d’utilisateur et le mot de passe de la base de données
  • Emplacement du centre de données : us-east4-a
  • Taille de la base de données : 2 cœurs de CPU – 512 Mo de RAM (Mini)

Cliquez sur le bouton Créer une base de données, et vous devriez être prêt.

Création d'une nouvelle base de données pour notre application d'exemple.
Création d’une nouvelle base de données pour notre application d’exemple.

Déployer une application

Assurez-vous que vous êtes sur la page Applications, cliquez sur Ajouter un service, puis sélectionnez Application dans le menu déroulant. En cliquant sur le champ du dépôt GitHub, vous devrez autoriser Kinsta à interagir avec votre dépôt.

Pour un guide vidéo, jetez un œil à nos tutoriels vidéo. Pour plus de documentation étape par étape, voir Ajouter une application.

Nous avons utilisé les valeurs suivantes dans le formulaire pour créer notre application d’exemple :

  • Dépôt GitHub : danielpataki/weatherlogger-js (dans votre cas, ce sera quelque chose comme your-organization/weatherlogger-js)
  • Branche par défaut : main
  • Déploiement automatique sur le commit : non coché
  • Environnement de construction : Configurer automatiquement l’image du conteneur
  • Nom de l’application : Weather Logger
  • Emplacement du centre de données : us-east4-a

Cliquez sur Ajouter une application et le processus de déploiement sera lancé.

Création d'une nouvelle application pour notre exemple.
Création d’une nouvelle application pour notre exemple.

Connexion de l’application et de la base de données

Une fois que la base de données est prête pour les connexions (une coche verte s’affiche à côté d’elle), nous pouvons la connecter à notre application, même si celle-ci est encore en cours de déploiement. Cliquez sur l’application Weather Logger, cliquez sur Réglages dans la colonne latérale, et faites défiler vers le bas pour trouver la section Connexions internes.

Connexions internes dans notre application d'exemple.
Connexions internes dans notre application d’exemple.

Cliquez sur Ajouter une connexion, et dans la fenêtre modale/popup qui apparaît, sélectionnez la base de données Weather Logger. Cochez la case Ajouter des variables d’environnement pour accéder à la base de données, faites défiler jusqu’au bas de la fenêtre et cliquez sur Ajouter une connexion.

Ajouter une connexion interne pour notre application d'exemple.
Ajouter une connexion interne pour notre application d’exemple.

Configuration de l’application

La prochaine chose sur notre liste est d’ajouter toutes les informations dont notre application a besoin sous forme de variables d’environnement. La plupart des informations ont été automatiquement ajoutées à l’étape précédente en remplissant les variables de connexion à la base de données.

La seule qui manque et qui est requise par l’application est la clé API OpenWeatherMap. Dans les Réglages, juste sous la section Connexions internes, vous verrez la section Variables d’environnement. Cliquez sur Ajouter une variable d’environnement et utilisez OPENWEATHER_KEY comme clé et votre clé de l’API comme valeur.

Ajoutez votre clé de l'API OpenWeather aux variables d'environnement.
Ajoutez votre clé de l’API OpenWeather aux variables d’environnement.

L’application prend en charge quelques variables supplémentaires pour contrôler la fréquence de mise à jour, les unités utilisées, etc. Jetez un coup d’œil à la documentation de l’application pour plus d’informations.

Configuration des processus

Nous avons mentionné au début que nous aurons besoin d’un serveur Web et d’un cronjob. Rendez-vous dans la section Processus de l »application, et vous verrez qu’un processus web est créé automatiquement et exécute npm start par défaut, ce qui est exactement ce dont nous avons besoin.

Pour configurer le cronjob, cliquez sur le bouton Créer un processus et remplissez le formulaire dans la modale/popup qui apparaît. Nous avons utilisé les valeurs suivantes pour notre exemple :

Nom : Worker
Type : Travail en arrière-plan
Commande de démarrage npm run weatherLogger
Pod taille : nano
Instances : 1

Cliquez ensuite sur le bouton Créer un processus.

Créer le processus d'arrière-plan pour notre application d'exemple.
Créer le processus d’arrière-plan pour notre application d’exemple.

Déployer l’application

Enfin, retournez à la section Déploiements et cliquez sur le bouton Déployer maintenant. Le déploiement prend généralement environ 90 secondes, mais vous devrez peut-être attendre un peu plus longtemps pour que tous les processus se mettent en place correctement. Votre première mesure météorologique devrait être enregistrée quelques minutes après. Pour vérifier que tout fonctionne, jetez un coup d’œil à la section Journaux.

Journaux d'exécution pour l'application d'exemple.
Journaux d’exécution pour l’application d’exemple.

Après quelques minutes, vous devriez voir des processus réussis dans les journaux d’exécution. Dans l’image d’exemple ci-dessus, la ligne 243 montre que la journalisation a commencé à fonctionner (Starting weather logging), et la ligne 244 montre que le serveur web est en cours d’exécution (Weather server is up and running). La ligne 245 et suivantes montrent deux événements de journalisation (Weather data retrieved).

Si vous retournez à la section Déploiements, vous devriez voir l’URL du dernier déploiement. Cliquez sur cette URL pour accéder à la page servie par le service web :

Page de la journalisation météo affichant les entrées météo.
Page de la journalisation météo affichant les entrées météo.