Comment configurer le déploiement continu sur AWS S3 à l'aide de CircleCI en 30 minutes seulement

Le déploiement continu peut sembler compliqué au début, mais ne vous laissez pas intimider. Dans ce didacticiel, je vais vous montrer comment mettre en œuvre le déploiement continu sur AWS S3 pour un site Web statique utilisant CircleCI en moins de 30 minutes.

Vous aurez besoin d’un compte AWS et d’un compte CircleCI. Si vous ne les avez pas encore, commencez par ouvrir un compte gratuit pour AWS ici et un compte CircleCI gratuit ici. AWS et CircleCI ont tous les deux un niveau gratuit suffisant pour ce dont vous aurez besoin pour ce didacticiel.

Obtenir le code

Tout d’abord, vous allez commencer par forger et cloner le référentiel de projet suivant sur Github: S3ContinuousDeploy ou, si vous préférez, vous pouvez essayer ce didacticiel avec l’un de vos propres référant tant qu’il s’agit d’un site statique.

Ensuite, vous ajouterez le projet à votre compte CircleCI.

Sélectionnez ensuite le référentiel S3ContinuousDeploy que vous venez de cloner et cliquez sur Build Project.

Choisissez le référentiel S3ContinuousDeploy et cliquez sur le projet de construction

À ce stade, la construction sera exécutée, mais vous recevrez un message d'erreur vous avertissant que les paramètres de votre projet ne peuvent pas être détectés. Ce qui est normal, car nous n’avons pas de fichier de configuration circle.yml en place, ce que vous ferez ensuite.

En consultant les documents de CircleCI, vous pouvez vous faire une idée de ce à quoi devrait ressembler circle.yml. Malheureusement, l'exemple de fichier circle.yml fourni ne fonctionnera pas tel quel et nécessitera quelques modifications, alors faisons-le.

Vous trouverez ci-dessous le fichier circle.yml modifié que vous utiliserez:

Fondamentalement, CircleCI crée la construction dans un conteneur Docker, et le remplacement de la propriété de dépendances (ligne 3) ajouté ajoute à CircleCI l’installation de l’interface de ligne de commande AWS (awscli) qui sera utilisée dans ce cas pour faciliter la gestion du déploiement sur AWS. S3.

Assurez-vous donc d’ajouter le fichier et de le valider pour votre dépôt. Enfin, assurez-vous d’appuyer cette opération et d’autres que vous auriez pu effectuer avant de passer à l’étape suivante.

Conformément à la documentation CircleCI, la commande de déploiement est la suivante:

Le chemin d'accès au fichier était un peu difficile à comprendre, mais en regardant les journaux d'erreurs, j'ai finalement réussi à le comprendre: home \ ubuntu \ projectName. Il suffit donc de remplacer nom_projet par le nom de votre projet. Dans mon cas, ce sera S3ContinuousDeploy.

L'URL de compartiment S3: //, en revanche, n'est pas correcte et doit être S3: // nom de compartiment. À l’heure actuelle, nous n’avons pas de nom de seau, nous allons donc nous en procurer un.

Création du compartiment S3

Dans cette étape, nous nous dirigerons vers la console AWS pour créer le compartiment S3 pour ce projet:

Dans votre console, accédez à Stockage puis à S3Appuyez sur Créer un seau

Entrez le nom du compartiment que vous souhaitez utiliser pour ce projet ainsi que la région. (La meilleure pratique consiste à utiliser la région la plus proche du public de votre site.)

Vous allez ignorer les autres étapes pour le moment, alors appuyez sur «Suivant», puis sur «Créer un compartiment» sur l'écran de révision.

À ce stade, si vous revenez à CircleCI et essayez de réexécuter la génération, CircleCI renverra une erreur fatale: Impossible de localiser les informations d'identification. Alors, pourquoi ne corrigeons-nous pas cela ensuite?

Nous devons d'abord obtenir les informations d'identification d'AWS, puis les fournir à CircleCI afin de permettre à AWS cli d'accéder et de gérer le compartiment S3. La meilleure pratique consiste à créer un nouvel utilisateur IAM (Identity and Access Management) spécifiquement pour CircleCI.

Sur la console AWS, accédez à Sécurité, Identité et conformité, appuyez sur IAM, puis sur Ajouter un utilisateur.

Dans la fenêtre Ajouter un utilisateur, tapez CircleCI pour Nom d'utilisateur, j'ai déjà un utilisateur IAM nommé Configuration de CircleCI. Ainsi, pour les besoins de ce tutoriel et pour illustrer ces étapes, j'utiliserai CircleCI2. Assurez-vous de cocher Accès par programme pour le type d'accès.

Pour les autorisations, choisissez lier directement les stratégies existantes et, sous Nom de la stratégie, cochez la case "AdministratorAccess", puis cliquez sur Créer une stratégie. Cela fournira à votre utilisateur IAM un accès complet à votre compartiment AWS S3.

Après avoir créé l'utilisateur IAM, assurez-vous de conserver à la fois l'ID de clé d'accès et la clé d'accès secrète, car nous en aurons besoin à l'étape suivante.

Revenons maintenant à CircleCI, cliquez sur le bouton des paramètres à côté du nom de votre projet pour afficher le menu des paramètres du projet, puis cliquez sur Autorisations AWS. C'est là que vous allez coller l'ID et la clé de l'étape précédente, puis cliquer sur «Enregistrer les clés AWS».

À présent, notre conteneur CircleCI dispose à la fois de l’outil d’interface de ligne de commande AWS et des informations d’accès permettant d’accéder au compartiment AWS S3. Les étapes suivantes vous montreront comment révéler votre site statique au monde entier.

Dans la console AWS, accédez à Stockage, puis cliquez sur S3, puis sur le compartiment que nous avons créé précédemment dans ce didacticiel.

Vous remarquerez que le code du référentiel a déjà été déployé avec succès.

Avant de pouvoir accéder à ce site statique, vous devez configurer votre compartiment S3 pour l'hébergement de sites Web.

Sur le même écran, cliquez sur Propriétés, puis sur Hébergement de site Web statique.

Dans l'écran suivant, sélectionnez Utiliser ce compartiment pour héberger un site Web et assurez-vous de saisir index.html pour le document Index.

En passant, l'adresse HTTP indiquée ci-dessus est votre point d'accès. Mais si vous l’essayez dans le navigateur, cela ne fonctionnera malheureusement pas et vous obtiendrez un message d’erreur d’accès refusé. Mais c’est normal que vous ayez encore une étape à faire: Configurer votre stratégie de compartiment.

Cette stratégie de compartiment permet à quiconque d'accéder au compartiment AWS S3 via un navigateur.

Vous pouvez lire ici sur les politiques et les exemples concernant les compartiments si vous voulez en savoir plus.

Vous pouvez maintenant copier le fragment de code ci-dessus et le coller dans votre éditeur de politique de seau et le tour est joué!

Si vous voyez l'écran ci-dessus, alors félicitations! Vous avez correctement configuré le déploiement continu dans un compartiment AWS S3 à l'aide de CircleCI.

Désormais, chaque fois que vous appliquez des modifications à votre référentiel Github, CircleCI déploie automatiquement les modifications apportées à votre compartiment AWS S3.

Vous avez peut-être remarqué que, même si le déploiement a réussi, CircleCI affiche un avertissement rouge NO TESTS.

Ceci est normal car dans un environnement de développement piloté par les tests (TDD), vous devez d'abord écrire des tests, puis avant de passer en production, votre code doit réussir tous les tests. Un exemple avec des tests dépasse le cadre de ce tutoriel, mais disons simplement que si nous avions écrit des tests, CircleCI n'aurait été déployé que si tous nos tests avaient réussi.

L'utilisation de votre propre nom de domaine pour accéder à ce site statique dépasse également la portée de ce didacticiel, mais n'hésitez pas à consulter ici les instructions relatives à la configuration d'Amazon Route 53 pour acheminer le trafic Internet vers votre nouveau site.

J'espère faire un tutoriel impliquant un exemple d'intégration / déploiement continu avec une batterie complète de tests, parfois à l'avenir. Pendant ce temps, si vous avez un moment, répondez ici à un bref sondage sur ce tutoriel, comme celui-ci sur LinkedIn ou postez un commentaire dans la section commentaires.

Merci d'avoir lu!