← Préparation

Leçon 2 sur 4 ⏱ 15 minutes

Installer l'éditeur VS Code

On va installer le programme dans lequel tu écriras ton code. C'est gratuit, et même les pros l'utilisent.

C’est quoi VS Code, et pourquoi celui-là

Visual Studio Code (on l’appelle VS Code pour faire court) est un éditeur – un programme pour écrire du code. Imagine Word, mais pour les programmeurs : il colore ton code, te donne des indices et signale les erreurs. C’est complètement gratuit, et les gens des plus grandes entreprises du monde l’utilisent pour construire des sites web. Apprends-le maintenant, et il te restera pour toujours.

⚠️

Installe-le avec un adulte à côté. Demande à un parent de t’accompagner – l’installation elle-même est sûre, mais c’est bien qu’il sache ce qui est installé sur l’ordinateur.

Installation sur Windows

  1. Ouvre code.visualstudio.com et clique sur le gros bouton bleu Download for Windows.

  2. Une fois le fichier téléchargé, clique dessus (tu le trouveras dans la barre des tâches en bas, ou dans ton dossier Téléchargements).

  3. Accepte la licence (coche I accept the agreement), puis continue à cliquer sur Next. À l’étape Select Additional Tasks, coche Create a desktop icon pour avoir une icône sur ton bureau.

  4. Clique sur Install et attends. Enfin, clique sur Finish – VS Code s’ouvrira.

Installation sur Mac

  1. Ouvre code.visualstudio.com et clique sur Download for macOS.

  2. Une fois le fichier téléchargé, trouve-le dans ton dossier Téléchargements. Si c’est un fichier .zip, double-clique dessus pour le décompresser.

  3. Une icône bleue Visual Studio Code apparaîtra. Glisse-la dans ton dossier Applications. C’est tout, c’est installé.

  4. Ouvre le dossier Applications et double-clique sur Visual Studio Code pour le lancer. La première fois, ton Mac demandera si tu veux vraiment l’ouvrir – clique sur Open.

Faire connaissance avec VS Code

VS Code parle beaucoup de langues – faisons un petit tour pour se sentir à l’aise :

  1. Dans la barre latérale gauche, clique sur l’icône qui ressemble à des carrés empilés (Extensions). Ça ressemble à quatre petits blocs.

  2. Dans la zone de recherche en haut, tape Prettier (ou n’importe quel nom de thème que tu aimes, comme Dracula ou Night Owl).

  3. Choisis quelque chose qui te plaît et clique sur Install à côté.

  4. Une petite fenêtre peut apparaître en bas à droite – suis ce qu’elle te propose. VS Code appliquera ton choix tout de suite.

Vérifie : VS Code s’ouvre et a l’air prêt à l’emploi, avec le menu en haut (File, Edit, Selection…). Si c’est le cas, tout est bon et ton atelier est prêt !

Ce que tu retiens de ce chapitre