Retour

Automatiser le déploiement d'un site statique Strapi avec n8n

À l’heure où la sobriété numérique devient un enjeu majeur, opter pour la génération statique d’un site web avec des outils comme Nuxt.js et le CMS Headless Strapi s’impose comme une démarche éco-responsable. En pré-générant les pages HTML lors du déploiement, on limite drastiquement les requêtes serveur, réduisant ainsi la consommation d’énergie et l’empreinte carbone du site durant sa consultation. C'est notamment le choix que nous avons fait pour notre projet Pacte Industrie pour l'ADEME.

Cette approche permet d’allier performance, accessibilité et respect de l’environnement. Toutefois, cette stack technique soulève une question clé : comment permettre à un contributeur non technique de regénérer simplement la version statique du site après avoir modifié plusieurs contenus dans le CMS ?

Dans cet article, nous allons voir comment mettre en place un trigger n8n sous forme de webhook avec Strapi afin de lancer un déploiement sur Bitbucket Cloud Pipeline directement depuis le back-office de Strapi. Cette solution permet aux équipes non techniques d'initier un déploiement en toute simplicité, tout en garantissant une intégration fluide avec les workflows existants.

Raisonnement et avantages de cette approche

L'utilisation de n8n comme intermédiaire permet d'automatiser et de chaîner plusieurs actions sans développements et intervention manuelle. En intégrant un webhook à Strapi, nous offrons aux administrateurs la possibilité de déclencher un déploiement sans avoir à passer par la CI/CD Bitbucket Cloud directement.

Voici les principaux avantages de cette solution :

  • Facilité d'intégration : Compatible avec les webhook natif, un déploiement peut être lancé depuis l'interface de Strapi.
  • Flexibilité : Possibilité d'ajouter des contrôles avant le déploiement (ex : validation d'un admin ou un profil technique, depuis un hook lors de l’édition d’une page).
  • Evolutivité : Paramétrable, cette méthode peut facilement être reproduite sur d’autres projets en capitalisant sur le même workflow.

Mise en place

1. Configuration du workflow n8n

Pour commencer, nous allons créer un workflow dans n8n qui récupèrera l'information du webhook et déclenchera un déploiement sur Bitbucket Cloud Pipeline.

  • Ajouter un Webhook Trigger dans n8n et configurer son URL.
  • Récupérer les données envoyées par Strapi (ex : ID de l'utilisateur, nom du projet).
  • Ajouter un noeud HTTP Request pour appeler l'API Bitbucket et démarrer un pipeline.
  • Ajouter les headers d'authentification et le body JSON contenant les paramètres de déploiement.
  • Nous avons également décidé d’ajouter à notre workflow des validateurs et des serializers pour vérifier nos informations.
  • Un message est envoyé sur Teams pour nous notifier du bon déroulement du workflow.
  • Tester le workflow et l'activer.

2. Création d'un webhook dans Strapi

Ensuite, nous allons créer un webhook dans Strapi qui sera appelé lorsqu'un administrateur initie un déploiement.

  • Aller dans Settings > Webhooks dans Strapi.
  • Ajouter l’URL du webhook provenant du workflow n8n (que nous venons de créer) ainsi que les paramètres permettant de lancer la bonne tâche de déploiement et le bon canal de notification Teams.
  • Choisir l'événement approprié, par exemple : l’appui sur un bouton "Déployer" dans une collection spécifique. Il est possible de laisser en déclenchement manuel.
  • Sauvegarder le webhook.

Dans notre cas d’exemple nous renseignons les champs pour publier un message sur Teams ainsi que les caractéristiques de notre pipeline.

Une image contenant texte, capture d’écran, logiciel, Logiciel multimédiaLe contenu généré par l’IA peut être incorrect.

3. Validation et tests

Pour vérifier que tout fonctionne correctement :

  • Appuyez sur le bouton dédié dans Strapi et observer si le webhook est appelé.
  • Consulter les logs de n8n pour voir si le déploiement est bien initié.
  • Vérifier sur Bitbucket Cloud si le pipeline s'exécute correctement.

Exemple Succès de déploiement :  

Une image contenant texte, capture d’écran, logiciel, Système d’exploitationLe contenu généré par l’IA peut être incorrect.

Exemple d’erreur de notification :  

Une image contenant capture d’écran, Logiciel multimédia, texte, logicielLe contenu généré par l’IA peut être incorrect.

Synthèse de cette solution technique

En intégrant n8n comme orchestrateur de déploiement entre le CMS Strapi et la CI/CD qui lance la génération Nuxt, nous avons mis en place une solution automatisée et flexible permettant de déclencher des déploiements à la demande. Cette approche facilite le travail des équipes tout en assurant un certain contrôle sur les processus de déploiement.

Points positifs

  • Automatisation efficace et sans intervention manuelle.  
  • Facile à mettre en place avec Strapi et n8n.  
  • Offre plus de contrôle sur les déploiements.  
  • Cette architecture peut être étendue à d'autres projets ou services.

Points négatifs

  • Pas de remontée en temps réel du résultat de déploiement (même si la gestion des notifications est possible)
  • Peut nécessiter une surveillance pour éviter des déclenchements concurrentiels.

Si vous souhaitez en savoir plus, n’hésitez pas à nous contacter.

Nous pouvons aussi vous aider à analyser votre ecosystème actuel avec un audit pour améliorer votre dispositif digital.