Lire un devcontainer.json

Le fichier du module précédent, annoté

Reprenons exactement le fichier créé au module 3 :

{
  "name": "Mon premier Dev Container",
  "image": "mcr.microsoft.com/devcontainers/javascript-node:20",
  "forwardPorts": [3000]
}

name

Un nom d'affichage, purement descriptif. Il apparaît dans l'interface de VS Code (barre en bas à gauche, sélecteur de fenêtres) pour identifier le Dev Container sans avoir à lire tout le JSON. Il n'a aucun effet fonctionnel sur le conteneur lui-même.

image

Le champ le plus important : le nom d'une image déjà construite, publiée sur un registre de conteneurs. Ici, mcr.microsoft.com/devcontainers/javascript-node:20 pointe vers une image officielle Microsoft contenant Node.js 20 sur une base Debian. C'est ce que Docker télécharge et instancie.

Alternative à image : le champ build (non utilisé dans notre exemple), qui construit l'image localement à partir d'un Dockerfile du projet plutôt que de la tirer telle quelle d'un registre — utile quand vous avez besoin d'un environnement plus spécifique que ce qu'une image publique propose. Un devcontainer.json utilise l'un ou l'autre, pas les deux en même temps.

forwardPorts

Un tableau des ports à rendre accessibles depuis la machine hôte. Ici, [3000] signifie : si un serveur écoute sur le port 3000 à l'intérieur du conteneur, il sera aussi joignable sur localhost:3000 depuis votre navigateur, sur l'hôte. Sans ça, un service qui tourne dans le conteneur resterait invisible de l'extérieur.

postCreateCommand (absent de notre exemple, mais courant)

Une commande — ou un tableau de commandes — exécutée automatiquement une seule fois, juste après que le conteneur a été créé. Typiquement utilisée pour installer les dépendances du projet, par exemple "postCreateCommand": "npm install". Notre exemple du module 3 ne l'utilise pas volontairement, pour rester minimal, mais c'est un champ que vous croiserez dans presque tous les devcontainer.json réels.

customizations.vscode.extensions (absent de notre exemple, mais courant)

Un objet imbriqué qui liste les extensions VS Code à installer automatiquement dans l'instance connectée au conteneur — par exemple un linter ou un support de langage spécifique au projet, pour que chaque personne qui ouvre le Dev Container ait le même outillage éditeur, pas seulement le même runtime.

Exercice d'auto-vérification

Avant de continuer, regardez ce second fichier devcontainer.json et répondez à deux questions, sans faire défiler plus bas tout de suite :

{
  "name": "API Python",
  "image": "mcr.microsoft.com/devcontainers/python:3.12",
  "forwardPorts": [8000],
  "postCreateCommand": "pip install -r requirements.txt",
  "customizations": {
    "vscode": {
      "extensions": ["ms-python.python"]
    }
  }
}

1. Quelle image de base ce conteneur utilise-t-il ?
2. Quel port est rendu accessible depuis l'hôte ?

Réponses

1. mcr.microsoft.com/devcontainers/python:3.12 — une image officielle avec Python 3.12 préinstallé.
2. Le port 8000 — typiquement le port par défaut d'un serveur de développement type Django ou FastAPI.

Bonus, si vous avez aussi repéré les deux autres champs : postCreateCommand installe automatiquement les dépendances listées dans requirements.txt dès la création du conteneur, et customizations.vscode.extensions installe l'extension Python officielle de Microsoft pour que l'autocomplétion et le débogueur Python soient prêts immédiatement.

Si vous avez trouvé les deux réponses sans relire la section d'annotation, vous savez lire un devcontainer.json. Au module suivant, on change complètement de sujet : direction pre-commit.