Exercice - Personnaliser les paramètres du projet et de l’éditeur

  • 4 minutes

Le fichier devcontainer.json vous permet de définir divers paramètres dans votre configuration Visual Studio Code conteneurisée. Jusqu’à présent, vous avez configuré un conteneur de développement pour un projet Python. Il y a encore certains paramètres précis et tâches d’installation que vous pouvez automatiser davantage.

Dans cet exercice, vous allez utiliser le fichier devcontainer.json pour affiner votre configuration et faire en sorte que le projet fonctionne sans aucune étape de configuration nécessaire de la part du développeur.

Installer les extensions Visual Studio Code

Le conteneur est fourni avec l’extension Microsoft Python (cf. son image de base). L’extension Python active les extraits, le linting et IntelliSense dans les fichiers Python. Toutefois, le fichier index.html dans le dossier templates est un modèle Jinja. Vous devez installer une autre extension pour bénéficier de la coloration syntaxique dans ce fichier.

  1. Appuyez sur F1 pour ouvrir la palette de commandes.
  2. Tapez extension, puis sélectionnez Extensions : Installer les extensions.
  3. Dans l’Explorateur d’extensions à droite, recherchez jinja.
  4. Sélectionnez Installer.
  5. Cliquez avec le bouton droit sur l’extension Jinja de wholroyd, puis sélectionnez Add to devcontainer.json (Ajouter à devcontainer.json).
  6. Revenez au fichier devcontainer.json et notez que l’extension Jinja a été ajoutée à la section extensions.
  7. Enregistrez le fichier devcontainer.json.

Automatiser l’installation des dépendances

À ce stade, un développeur qui configure le projet pour la première fois doit savoir qu’il faut exécuter pip3 install --user -r requirements.txt pour installer les dépendances. Sans ces dépendances, le projet ne s’exécutera pas et les autres développeurs ne sauront pas pourquoi.

  1. Décommentez l’option postCreateCommand.

    "postCreateCommand": "pip3 install --user -r requirements.txt"

  2. Enregistrez le fichier devcontainer.json.

Le conteneur installe automatiquement les dépendances chaque fois qu’un conteneur est créé.

Regénérer le nouveau conteneur

  1. Appuyez sur F1 pour ouvrir la palette de commandes.
  2. Tapez Régénérer, puis sélectionnez Conteneurs de développement : Régénérer le conteneur.

Le conteneur est regénéré avec les changements que vous avez spécifiés dans le fichier devcontainer.json.

Notes

Chaque fois qu’un conteneur est regénéré, il est supprimé et entièrement recréé. L’historique de terminal n’est pas conservé lorsqu’un conteneur est regénéré.

Examiner la coloration syntaxique fournie par l’extension Jinja

  1. Ouvrez le fichier templates/index.html .

  2. Faites défiler l’affichage jusqu’à la ligne 33, où vous pouvez noter la coloration syntaxique sur la boucle for. Cette mise en surbrillance de la syntaxe est activée par l’extension Jinja.

    Screenshot of a Jinja template, emphasizing a for loop with syntax highlighting.

Exécuter l’application

  1. Appuyez sur Ctrl + ` pour ouvrir le terminal intégré Visual Studio Code.

  2. Exécutez l’application en utilisant la commande suivante :

    python app.py

  3. Notez que vous n’avez pas eu besoin d’installer de dépendances. L’application s’exécute simplement.

Le conteneur est maintenant personnalisé et automatisé pour votre agence. Tout développeur qui ouvre ce projet en utilisant Dev Containers peut immédiatement l’exécuter et se mettre au travail en écrivant du code.

Dans la prochaine unité, vous allez découvrir comment installer des logiciels supplémentaires dans le conteneur de développement.