Étape 2 : présentation simple de l'IDE - AWS Cloud9

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Étape 2 : présentation simple de l'IDE

(Étape précédente : Étape 1 : Créer un environnement)

Cette partie du tutoriel présente certaines utilisations de l'IDE AWS Cloud9 pour créer et tester des applications.

  • Vous pouvez utiliser une fenêtre de l'éditeur pour créer et modifier le code.

  • Vous pouvez utiliser une fenêtre de terminal ou une fenêtre Run configuration (Exécuter la configuration) pour exécuter votre code sans le déboguer.

  • Vous pouvez utiliser la fenêtre Debugger pour déboguer votre code.

Effectuez ces trois tâches à JavaScript l'aide du moteur Node.js. Pour des instructions sur l'utilisation d'autres langages de programmation, consultez Didacticiels pour AWS Cloud9.

Préparation de votre environnement

La plupart des outils dont vous avez besoin pour exécuter et déboguer le JavaScript code sont déjà installés pour vous. Pour ce tutoriel, vous avez cependant besoin d'un package Node.js supplémentaire. Installez-le comme suit.

  1. Dans la barre de menus en haut de l'IDE AWS Cloud9, choisissez Window (Fenêtre), New Terminal (Nouveau terminal) ou utilisez une fenêtre de terminal existante.

  2. Dans la fenêtre du terminal, qui est l'un des onglets de la partie inférieure de l'IDE, entrez ce qui suit.

    npm install readline-sync

    Vérifiez que le résultat est similaire au résultat suivant. Si des messages npm WARN sont également affichés, vous pouvez les ignorer.

    + readline-sync@1.4.10 added 1 package from 1 contributor and audited 5 packages in 0.565s found 0 vulnerabilities

Écrire du code

Commencez par écrire du code.

  1. Dans la barre de menus, choisissez File (Fichier), New File (Nouveau fichier).

  2. Ajoutez ce qui suit JavaScript au nouveau fichier.

    var readline = require('readline-sync'); var i = 10; var input; console.log("Hello Cloud9!"); console.log("i is " + i); do { input = readline.question("Enter a number (or 'q' to quit): "); if (input === 'q') { console.log('OK, exiting.') } else{ i += Number(input); console.log("i is now " + i); } } while (input != 'q'); console.log("Goodbye!");
  3. Choisissez File (Fichier),Save (Enregistrer), puis enregistrez le fichier sous le nom hello-cloud9.js.

Exécuter votre code

Vous pouvez ensuite exécuter votre code.

En fonction du langage de programmation que vous utilisez, vous pouvez exécuter du code de différentes façons. Ce didacticiel utilise JavaScript, que vous pouvez exécuter à l'aide d'une fenêtre de terminal ou d'une fenêtre de configuration d'exécution.

Pour exécuter le code à l'aide d'une fenêtre Run Configuration (Exécuter la configuration)
  1. Dans la barre de menus, choisissez Exécuter, Configurations d'exécution, Nouvelle configuration d'exécution.

  2. Dans la nouvelle fenêtre Exécuter la configuration (l'un des onglets dans la partie inférieure de l'IDE), saisissez hello-cloud9.js dans le champ Commande puis choisissez Exécuter.

  3. Assurez-vous que l'invite Run Configuration (Exécuter la configuration) est active, puis interagissez avec l'application en saisissant un nombre à l'invite.

  4. Affichez la sortie de votre code dans la fenêtre Run Configuration (Exécuter la configuration). Il ressemble à ce qui suit.

Exécutez le code dans une fenêtre Exécuter la configuration.
Pour exécuter le code à l'aide d'une fenêtre de terminal
  1. Accédez à la fenêtre de terminal que vous avez utilisée précédemment (ou ouvrez une nouvelle fenêtre).

  2. Dans la fenêtre de terminal, saisissez ls à l'invite du terminal et vérifiez que votre fichier de code figure dans la liste des fichiers.

  3. Saisissez node hello-cloud9.js à l'invite pour démarrer l'application.

  4. Interagissez avec l'application en saisissant un numéro à l'invite.

  5. Affichez la sortie de votre code dans la fenêtre de terminal. Il ressemble à ce qui suit.

Exécutez le code dans une fenêtre Exécuter la configuration.

Déboguer votre code

Enfin, vous pouvez déboguer votre code à l'aide de la fenêtre Debugger (Débogueur) .

  1. Ajoutez un point d'arrêt à votre code à la ligne 10 (if (input === 'q')) en choisissant la marge en regard de la ligne 10. Un point rouge s'affiche en regard de ce numéro de ligne, comme illustré.

    Ajout d'un point d'arrêt au code.
  2. Ouvrez la fenêtre Débogueur en choisissant le bouton Débogueur situé sur le côté droit de l'IDE. Sinon, choisissez Window (Fenêtre), Debugger (Débogueur) dans la barre de menus.

    Placez ensuite une évaluation sur la variable d'input, en choisissant Type an expression here (Saisir une expression ici) dans la section Watch Expressions (Expressions d'évaluation) de la fenêtre Debugger (Débogueur).

    Fenêtre Debugger (Débogueur), définir une évaluation
  3. Accédez à la fenêtre Run Configuration (Exécuter la configuration) que vous avez utilisée précédemment pour exécuter le code. Cliquez sur Exécuter.

    Sinon, vous pouvez ouvrir une nouvelle fenêtre Run Configuration (Configuration d'exécution) et commencer à exécuter le code. Faites-le en choisissant Run (Exécuter), Run With (Exécuter avec), Node.js dans la barre de menu.

  4. Entrez un nombre à l'invite Run Configuration (Exécuter la configuration) et observez l'interruption du code à la ligne 10. La fenêtre Debugger (Débogueur) affiche la valeur que vous avez saisie dans Watch Expressions (Expressions d'évaluation).

    Le programme s'arrête au point d'arrêt
  5. Dans la fenêtre Debugger (Débogueur), choisissez Resume (Reprendre). Il s'agit de l'icône de la flèche bleue qui est mise en évidence dans la capture d'écran précédente.

  6. Sélectionnez Stop (Arrêter) dans la fenêtre Run Configuration (Exécuter la configuration) pour arrêter le débogueur.

    Arrêt du débogueur.

Étape suivante

Étape 3 : Nettoyer