Comment mettre en place un pipeline CI/CD pour les API REST Node.js avec GitHub Actions et Netlify

Netlify est une plateforme d’hébergement web et une suite complète d’outils pour déployer et gérer des applications web dans le cloud.

Mais ses fonctionnalités vont bien au-delà : ses fonctions sans serveur vous permettent d’exécuter du code côté serveur sans serveur dédié.

Découvrez comment mettre en place un pipeline CI/CD pour déployer une API REST Node.js sur Netlify à l’aide des actions GitHub.

Pipelines CI/CD avec GitHub Actions : Une vue d’ensemble

Les pipelines d’intégration et de livraison continues (CI/CD) sont une série de processus séquentiels et automatisés que les applications logicielles subissent avant d’être livrées à la production.

Généralement, les pipelines CI/CD se composent de plusieurs phases clés, notamment les phases de source, de construction, de test et de déploiement.

Bien qu’il soit possible d’exécuter ces phases manuellement, leur automatisation offre plusieurs avantages, notamment :

  • Minimiser le risque d’erreurs humaines.
  • Accélérer le processus de mise en production.
  • Garantir un flux de travail cohérent pour l’envoi de logiciels de qualité à la production.

Qu’est-ce que GitHub Actions ?

GitHub Actions est un outil intégré à GitHub qui fournit une large gamme d’actions préconstruites que vous pouvez utiliser pour définir des workflows-as-code directement dans votre référentiel de projet afin d’automatiser les pipelines CI/CD.

Vous pouvez également créer des actions personnalisées pour répondre aux besoins spécifiques de votre projet, ce qui vous permet de créer et de déployer des applications en production sans problème. L’un des avantages de GitHub Actions est son intégration transparente avec d’autres fonctionnalités de GitHub, telles que les demandes d’extraction et le suivi des problèmes.

Cela permet de déclencher des flux de travail basés sur des événements spécifiques, tels qu’un nouveau commit, en veillant à ce que vos pipelines CI/CD soient automatiquement déclenchés en cas de besoin.

Configurer le projet Node.js

Pour commencer, vous devez créer un serveur web Express. Pour ce faire, créez un nouveau dossier localement et modifiez le répertoire sur votre terminal.

Ensuite, créez un package.json à l’aide de npm, le gestionnaire de paquets de Node.

Enfin, installez les dépendances nécessaires au projet.

Les netlify-lambda sert de serveur de développement local qui facilite le test des fonctions sans serveur. serverless-http aide à adapter les apps Express.js à un format compatible avec les gestionnaires de fonctions sans serveur.

Netlify ne fournit pas de support natif pour l’hébergement et l’exécution d’applications backend à part entière. Au lieu de cela, il propose des fonctions sans serveur comme solution alternative pour gérer les fonctionnalités de backend.

Voir aussi :  Comment construire un système de navigation mobile avec React Navigation

Ces fonctions gèrent la logique côté serveur, traitent les demandes d’API HTTP et servent le contenu dynamique, fournissant une fonctionnalité de type backend dans le paradigme sans serveur.

Vous pouvez trouver le code de ce projet dans son dépôt GitHub.

Créer le serveur Web Express

Créez trois dossiers : dist, fonctions et src dans le répertoire racine de votre dossier de projet.

Avant de configurer le serveur Express, créez un fichier vierge index.html dans le fichier dist dans le dossier dist . Ce fichier sert d’espace réservé qui permet à Netlify de déployer avec succès l’application Express et de servir les routes API.

Maintenant, créez un fichier src/app.js et ajoutez le code suivant :

Ce code définit un serveur Express avec une seule route pour l’URL racine qui gère les requêtes GET. Le code app.use enregistre l’intergiciel de la route avec l’application Express, ce qui garantit que toutes les requêtes HTTP effectuées vers le chemin <url>/.netlify/functions/app sera correctement traitée par le routeur, même dans un environnement de production.

Par conséquent, si vous ajoutez un nouveau point de terminaison tel que /api/auth il sera accessible sur <url>/.netlify/functions/app/api/auth. Enfin, le code exporte l’application Express et la fonction de gestion sans serveur.

Cela permet de tester localement le serveur et de s’assurer que vous pouvez le déployer en tant que fonction sans serveur sur Netlify.

Définir le fichier Netlify.toml

Dans le répertoire racine, créez un nouveau fichier Netlify.toml et ajoutez le code suivant.

Le code spécifie les paramètres de configuration de construction et de déploiement pour l’application Express sur Netlify. Il inclut des paramètres tels que le répertoire de base, la commande de construction, le répertoire de publication et le répertoire des fonctions.

En outre, il définit les paramètres de redirection qui devraient gérer le routage des demandes d’API HTTP, en veillant à ce qu’elles soient correctement dirigées vers les fonctions sans serveur de Netlify.

Mettre à jour le fichier Package.json

Ouvrez le fichier package.json et ajoutez ces commandes à l’objet scripts.

Exécutez les commandes suivantes pour construire et démarrer l’application localement.

Le serveur démarrera sur le port 9000. Vous pouvez tester l’API à l’aide de Postman en adressant des demandes à http://localhost:9000/.netlify/functions/app

Voir aussi :  Comment implémenter les fonctions de sauvegarde et de chargement dans Godot

Enfin, avant de configurer le workflow GitHub Actions pour automatiser les déploiements sur Netlify, créez un dépôt sur GitHub, et poussez les fichiers du projet.

Déployer l’application Express sur Netlify

Tout d’abord, déployez l’API sur Netlify avant de configurer le flux de travail GitHub Actions. Suivez les étapes suivantes pour déployer l’application Express sur Netlify.

  1. Rendez-vous sur Netlify et créez un compte, puis connectez-vous à l’espace de travail Vue d’ensemble .
  2. Sélectionnez et cliquez sur la page Sites et cliquez sur l’onglet
  3. Cliquez sur l’onglet Importer de Git et sélectionnez GitHub comme plateforme Git. Netlify vous demandera de vous authentifier auprès de GitHub pour lui donner accès à votre compte et aux référentiels du projet.
  4. Sélectionnez le dépôt du projet Express dans la liste des dépôts affichés.
  5. Après avoir sélectionné le dépôt, vous devez configurer les paramètres de construction pour le processus de déploiement. Netlify simplifie ce processus en détectant automatiquement la technologie utilisée pour construire l’application et en pré-remplissant les champs avec les paramètres de construction requis. Dans ce cas, il s’agit de la commande de construction, de la publication et du répertoire des fonctions.
  6. Enfin, cliquez sur le bouton Déployer le site pour terminer le processus.

Créer un flux de travail pour les actions GitHub

Cliquez sur le bouton Actions dans le dépôt GitHub de votre projet. Dans l’onglet Intégration continue sélectionnez et cliquez sur Configurer Node.js workflow.

Depuis l’éditeur GitHub, renommez le nom du fichier en Netlify.yml, supprimez le code de flux de travail Node.js standard et ajoutez le code ci-dessous :

Voici une décomposition des propriétés du flux de travail :

  • sur: Événements qui déclenchent les actions dans ce flux de travail.
  • travaux: Spécifie l’événement qu’une action particulière doit exécuter, à savoir les événements de construction et de déploiement.
  • s’exécute: l’environnement de production de l’hôte pour l’action.
  • étapes: Spécifie une série d’étapes nécessaires à l’exécution d’un travail particulier.
  • avec: Définit les arguments nécessaires au bon déroulement des actions.
  • env : spécifie les variables d’environnement requises pour le flux de travail.

Enfin, livrez les mises à jour apportées à ce fichier. GitHub devrait déclencher automatiquement le flux de travail.

Le build initial, cependant, déclenchera une erreur car vous devez ajouter des variables secrètes requises par le workflow : l’ID du site déployé et le jeton d’authentification de Netlify. Dirigez-vous vers votre Paramètres du site sur Netlify et copiez le fichier Site ID.

Voir aussi :  10 principes de base de la programmation que tout programmeur doit connaître

Pour obtenir le jeton d’authentification, cliquez sur l’icône profil de l’utilisateur et sélectionnez l’icône Paramètres de l’utilisateur dans la fenêtre déroulante. Sur la page des paramètres, sélectionnez Applications et cliquez sur Nouveau jeton d’accès pour générer votre jeton d’authentification.

Ajoutez les deux variables d’environnement NETLIFY_SITE_ID et NETLIFY_AUTH_TOKEN aux sections des variables d’environnement et des secrets de dépôt dans votre dépôt GitHub. Après avoir effectué ces modifications, réexécutez le flux de travail. Netlify déploiera automatiquement toutes les modifications ultérieures que vous pousserez à l’aide de ce pipeline.

Allez-y et testez l’API à l’aide de Postman en effectuant des requêtes vers cette URL : <url du site de netlify>/.netlify/functions/app.

Configurer des pipelines CI/CD avec les actions GitHub et Netlify

En utilisant les fonctions sans serveur de Netlify, vous pouvez déployer des applications web à part entière qui englobent les fonctionnalités côté client et backend sur Netlify.

En outre, la mise en place de pipelines CI/CD pour les applications avec GitHub Actions offre une approche rationalisée de l’automatisation du processus de construction et de déploiement. Cela vous permet de définir des flux de travail qui garantissent un processus de développement transparent et fiable, en commençant par l’idéation et en progressant jusqu’à la phase de publication.

Comment écrire un pipeline CI CD dans GitHub Actions ?

CI/CD avec GitHub Actions

  • Cliquez sur le bouton Actions disponible dans la barre de navigation du référentiel.
  • Sélectionnez le workflow que vous souhaitez appliquer (GitHub recommandera automatiquement les workflows en fonction de votre code).
  • Maintenant, vous pouvez voir qu’un fichier de workflow est créé, qui est un fichier YML.

Comment déployer une API node js sur Netlify ?

Déploiement à partir d’un dossier de l’ordinateur local

  • Créez un dossier et incluez tous les fichiers de votre projet (comme HTML, CSS, JavaScript etc).
  • Connectez-vous à Netlify et cliquez sur créer un nouveau site / bouton Ajouter un nouveau site et sélectionnez Déployer manuellement.
  • Maintenant, glissez-déposez le dossier du projet sur Netlify comme indiqué :

Netlify supporte-t-il node JS ?

Netlify supporte pnpm pour Node. js 16.9. 0 et ultérieures.

Peut-on déployer une application Nodejs sur Netlify ?

Netlify Functions est une fonctionnalité puissante de la plate-forme Netlify qui vous permet de déployer et d’exécuter des fonctions sans serveur écrites en Node. js.

Cliquez pour évaluer cet article !
[Total: Moyenne : ]

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *