avec AWS CodeStar et AWS Cloud9

Dans ce didacticiel, vous apprendrez à utiliser AWS CodeStar et AWS Cloud9 pour développer, concevoir et déployer une application Web sans serveur Node.js. Pour un développeur, la configuration d'un flux de développement logiciel automatisé peut s'avérer compliqué et chronophage. AWS CodeStar est un outil de développement logiciel qui vous permet de rapidement développer, concevoir et déployer des applications sur AWS. Avec CodeStar, vous pouvez configurer votre chaîne d'outils de livraison continue en quelques minutes et commencer à publier du code plus rapidement.

Cloud9 est un IDE cloud pour écrire, exécuter et déboguer du code. Cloud9 est préconçu avec les outils essentiels pour de nombreux langages de programmation courants (JavaScript, Python, PHP, etc). Vous n'avez donc aucun besoin d'installer des compilateurs ou autres chaînes d'outils.

Dans les minutes qui suivent, vous allez utiliser AWS CodeStar pour concevoir une nouvelle application Web sans serveur Node.js basée sur AWS Lambda. Vous allez utiliser AWS CodeStar pour configurer une chaîne d'outils de livraison continue à l'aide d'AWS CodeCommit pour le contrôle du code source, et à l'aide d'AWS CodePipeline pour automatiser votre processus de lancement. Vous procéderez ensuite à la modification d'une partie du code dans le projet Node.js à l'aide de Cloud9 et validerez cette modification pour déclencher votre pipeline continu et redéployer votre projet.

Les services AWS que vous utilisez dans ce didacticiel sont inclus dans l'offre gratuite AWS.

Ce didacticiel nécessite d'avoir un compte AWS.

Créez un compte gratuit

Il n'y a pas de frais supplémentaires pour AWS CodeStar, ni pour AWS Cloud9. Les ressources que vous créez dans ce didacticiel sont éligibles à l’offre gratuite.

Voir les détails relatifs à l'offre gratuite d'AWS »

Ouvrez AWS Management Console pour pouvoir garder ce guide détaillé ouvert. Lorsque cet écran se charge, saisissez votre nom d'utilisateur et votre mot de passe pour commencer. Saisissez ensuite Codestar dans la barre de recherche et sélectionnez CodeStar pour ouvrir la console CodeStar.

build-serverless-app-codestar-cloud9-00

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-00

Dans cette étape, vous allez configurer CodeStar, puis créer et déployer un projet Node.js AWS Lambda sans serveur.


a. Sur la page d'accueil de CodeStar, sélectionnez Start a project (Démarrer un projet).

 

build-serverless-app-codestar-cloud9-01

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-01

b. CodeStar peut vous aider en administrant les ressources AWS en votre nom ; pour activer cette fonctionnalité, CodeStar doit créer pour vous un rôle de service AWS. Dans la boîte de dialogue Create service role (Créer un rôle de service), choisissez Yes, create role (Oui, créer le rôle).

build-serverless-app-codestar-cloud9-01a

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-01a

c. Sur la page Choose a project template (Choisir un modèle de projet), choisissez le modèle Node.js comprenant une application Web et AWS Lambda. Vous pouvez utiliser CodeStar pour développer une grande variété d'applications, telles que des sites Web, des applications Web, des services Web et des compétences Alexa. Vous pouvez utiliser les langages de développement suivants : Java, JavaScript, PHP, Ruby, C#, Go, HTML et Python.

build-serverless-app-codestar-cloud9-02

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-02

d. Sur la page Project details (Détails du projet) du nom du projet, saisissez nodejs-serverless-project. Confirmez que vous avez sélectionné AWS CodeCommit, puis sélectionnez Next (Suivant).

build-serverless-app-codestar-cloud9-03

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-03

e. Sur la page Review project details (Vérifier les détails du projet), notez que CodeStar configurera un pipeline d'intégration continue complet à l'aide de CodeCommit pour le contrôle de version, d'AWS CodeBuild pour la conception et les tests, et d'AWS CloudFormation pour le déploiement sur Lambda. En outre, CodeStar utilisera Amazon CloudWatch pour surveiller votre application. Sélectionnez Create Project (Créer un projet).

build-serverless-app-codestar-cloud9-04

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-04

f. Sur la page Set up tool (Configurer l'outil), sous Pick how you want to edit your code (Choisir la façon dont vous voulez modifier votre code), sélectionnez AWS Cloud9, puis Next (Suivant).

build-serverless-app-codestar-cloud9-05

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-05

g. Sur la page Configurer votre environnement AWS Cloud9, sous Recommended instances (Instances recommandées), sélectionnez t2.micro, puis Next (Suivant). L'IDE Cloud9 s'exécutera sur cette instance et vous y accèderez via votre navigateur.

build-serverless-app-codestar-cloud9-06

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-06

h. AWS CodeStar va à présent configurer votre projet CodeStar et le connecter à votre IDE Cloud9. D'ici quelques minutes, vous verrez s'afficher le message Success! Your project and IDE are set up and ready to use (Opération réussie. Votre projet et votre IDE sont configurés et prêts à être utilisés).

build-serverless-app-codestar-cloud9-07

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-07

i. Le tableau de bord de votre projet va bientôt s'afficher. Localisez la vignette Application endpoints (Points de terminaison de l'application) et sélectionnez le lien qui apparaît entre les barres horizontales. Votre nouvelle application Node.js devrait apparaître dans un nouvel onglet ou une fenêtre de navigateur. L'icône d'attente apparaît et disparaît tour à tour pendant tout le processus de déploiement continu.

build-serverless-app-codestar-cloud9-08

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-08

Dans cette étape, vous allez apporter des modifications au code de votre application à l'aide de Cloud9, puis valider ces modifications dans CodeCommit, qui demandera à CodePipeline de déclencher automatiquement la conception de votre code via CodeBuild et son déploiement sur Lambda via CloudFormation.


a. Dans le tableau de bord d'AWS CodeStar, sélectionnez Start coding (Commencer le codage). CodeStar va à présent procéder au clonage de votre référentiel git dans votre environnement Cloud9 et ouvrir l'IDE Cloud9 dans votre navigateur. En bas de l'IDE Cloud9 de l'onglet bash, changez de répertoire pour pouvoir commencer à travailler avec votre code à l'aide de la commande suivante :

cd /home/ec2-user/environment/nodejs-serverle
build-serverless-app-codestar-cloud9-09

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-09

b. Il est recommandé de configurer les valeurs user.name et user.email de votre référentiel git lorsque vous configurez un nouvel environnement Cloud9 à l'aide des commandes suivantes :

git config --global user.name YOUR_USER_NAME
git config --global user.email YOUR_EMAIL_ADDRESS

c. À présent que votre environnement est entièrement configuré, vous pouvez passer au développement. Dans l'IDE Cloud9, sélectionnez l'onglet Navigate (Accéder) sur la gauche, puis index.html. Le fichier index.html s'ouvre dans votre IDE Cloud9.

build-serverless-app-codestar-cloud9-10

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-10

d. Comme la plupart des IDE, Cloud9 dispose de touches de raccourcis pour modifier et rechercher du texte. Pour rechercher la ligne de code à modifier, appuyez sur Commande-f sous macOS, Ctrl-f sous Windows, ou Ctr-f sous Linux. Saisissez appl dans la barre de recherche : l'éditeur de Cloud9 fait alors défiler la page pour mettre en évidence la chaîne appl sur la ligne 62, ou à proximité.

build-serverless-app-codestar-cloud9-11

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-11

e. Dans l'IDE Cloud9, ajoutez 3 points d'exclamation après le mot application, puis enregistrez vos modifications en appuyant simultanément sur les touches Commande-s sous macOS, Ctrl-s sous Windows, ou Ctrl-s sous Linux.

build-serverless-app-codestar-cloud9-12

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-12

f. Dans l'onglet bash en bas de l'IDE Cloud9, saisissez la commande suivante pour confirmer l'enregistrement de vos modifications :

git status

Si git renvoie modified: public/index.html en rouge, vos modifications ont bien été enregistrées et vous pouvez commencer à les ajouter et à les valider.

Si git renvoie le message nothing to commit, working tree clean (rien à valider, l'arborescence de travail est propre), vous devez enregistrer vos modifications dans l'IDE Cloud9.


g. Ajoutez et validez vos modifications, puis transmettez-les à la branche principale de git dans CodeCommit à l'aide de la commande suivante :

  git add public/index.html
  git commit -m "add three bangs"
  git push origin master
build-serverless-app-codestar-cloud9-14

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-14

h. Une fois que vos modifications sont transmises à la branche principale dans CodeCommit, CodePipeline déclenche le processus de déploiement continu. Pour surveiller le processus, allez dans votre tableau de bord AWS CodeStar et faites défiler la page vers le bas jusqu'à la vignette Continuous deployment (Déploiement continu). Après quelques minutes, vous verrez votre code passer de l'étape source à l'étape de génération, puis à l'étape de déploiement.

build-serverless-app-codestar-cloud9-15

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-15

i. Une fois que votre code a atteint l'étape de déploiement, sélectionnez l'URL de la vignette Application endpoints (Points de terminaison de l'application) dans CodeStar pour confirmer que vos modifications ont atteint votre application Web active. Une fois que la page charge dans votre navigateur, confirmez qu'elle contient bien les points d'exclamation que vous avez ajoutés.

build-serverless-app-codestar-cloud9-16

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-16

Dans cette étape, vous allez résilier votre projet CodeStar, votre environnement Cloud9, ainsi que toutes les ressources connexes.

Important : il est conseillé de résilier les ressources qui ne sont pas utilisées de façon active, afin de réduire les coûts. Des ressources non résiliées peuvent entraîner des frais.


a. Pour accéder à la page principale de la console CodeStar, sélectionnez AWS CodeStar, puis les trois points de suspension, et enfin Delete (Supprimer).

build-serverless-app-codestar-cloud9-17

(cliquez pour zoomer)

build-serverless-app-codestar-cloud9-17

b. Sur l'écran Delete project (Supprimer le projet), saisissez nodejs-serverle dans la zone de texte, puis sélectionnez Delete (Supprimer).

Vous venez d'utiliser AWS CodeStar et AWS Cloud9 pour concevoir, développer et déployer une application Web sans serveur Node.js basée sur AWS Lambda.

AWS CodeStar constitue un excellent choix pour développer, concevoir et déployer une grande variété d'applications, telles que des sites Web, des applications Web, des services Web et des compétences Alexa. Vous pouvez utiliser les langages de développement suivants : Java, JavaScript, PHP, Ruby, C# et Python.

AWS Cloud9 constitue un excellent IDE cloud pour écrire, exécuter et déboguer du code dans JavaScript, Python ou PHP lorsque vous ne voulez pas avoir à configurer et assurer la maintenance de compilateurs et de chaînes d'outils.

À présent que vous savez comment utiliser AWS CodeStar et AWS Cloud9 pour concevoir une application sans serveur, vous pouvez choisir l'une des options suivantes pour en savoir plus :

Intégration de votre IDE avec AWS CodeStar

Écrivez et développez du code dans votre environnement préféré et transmettez-le à CodeStar.

Intégration de votre IDE avec AWS CodeStar »

Collaboration avec les équipes AWS CodeStar

Collaborez avec d'autres personnes en leur accordant l'accès aux projets AWS CodeStar.

Ajout de membres à votre équipe AWS CodeStar »

Blog consacré à l'IA

Configurez et personnalisez l'environnement de développement intégré Cloud9.

Personnalisation de Cloud9 »