VSCode
Ce billet présente la gestion d'un projet de développement sur une machine distante mis en œuvre avec Visual Studio Code et géré par GitHub.
Visual Studio Code ou VSCode est un outil de développement. Il permet de construire une structure de fichiers pour votre programmes et d'éditer ces fichiers avec des outils adaptés aux languages de programmation utilisés.
Les fonctions de Visual Studio Code s'étendent avec des extensions dédiées pour chaque besoin, comme l'accès à une machine distante, la compilation de programmes sources, le déploiement sur une machine distante, la gestion du versionning, et bien d'autres possibilités.
GitHub est un outil de gestion de projet de développements en ligne. Il inclut entre autres la gestion des versions du projet et des fichiers. Il permet également à plusieurs développeurs de travailer en même temps sur le même projet. On peut aussi mettre son projet à la disposition de la communauté gratuitement.
Dans cet exemple les fichiers sont des scripts Unix. VScode accède aux fichiers de scripts directement à partir de la machine distance sur laquelle ils doivent être exécutés.
Table of Contents
Installation de Visual Studio Code.
VsCode se télécharge à partir du site code.visualstudio.com. Dans le cas d'un Mac, une fois le fichier d'installation VSCode-darwin-universal.zip téléchargé, on le décompresse et l'on place le fichier décompressé Visual Studio Code.app dans le dossier Application. Et c'est fini.
Première exécution de Visual Studio Code.
Lors de la première exécution, comme pour toute application téléchargée depuis le Web, un message d'avertissement s'affiche et vous demande si vous souhaitez l'ouvrir.
En cliquant sur le bouton Ouvrir, l'application se lance.
Le message d'avertissement ne s'affichera plus aux lancements suivants.
Connecter Visual Studio Code à une machine distante.
Pour certains développements, comme le développement de scripts Unix, il est très utile de connecter l'environnement de développement VSCode sur la machine qui devra exécuter votre code. Cela permet de tester les scripts en cours de développement au fil de l'eau. Dans ce cas les fichiers qui seront édités par Vscode seront directement ceux résidant sur la machine distante.
VSCode utilise SSH pour se connecter au système distant. La solution la plus sécurisée consiste à s'authentifier avec une clé publique. Celà évite d'utiliser le mot de passe du compte d'adminsitration de la machine distante pour s'authentifier.
Générer une paire de clé pour SSH sur un Mac
La création de la paire de clés Publique/Privée se fait sur un Mac avec l'application Terminal.
Lancez l'application Terminal et excutez la commande suivante:
ssh-keygenSi vous ne spécifiez aucun paramètre supplémentaire la procédure va créer une clé de type Ed25519 à l'emplacement $HOME/.ssh avec comme nom de fichiers id_ Ed25519 pour stocker la clé privée et id_ Ed25519.pub pour stocker la clé publique.
Si vous souhaitez en savoir plus sur le type de clé Ed25519 vous pouvez commencer par lire cette page.
Pour plus d'information sur la commande ssh-keygen, vous pouvez vous référez au Manuel de Debian.
La procédure de création de la paire de clé SSH se déroule comme suit:
Generating public/private ed25519 key pair.
Enter file in which to save the key (/Users/fxlevy/.ssh/id_ed25519):
Created directory '/Users/fxlevy/.ssh'.
Enter passphrase for "/Users/fxlevy/.ssh/id_ed25519" (empty for no passphrase):
Enter same passphrase again:
Your identification has been saved in /Users/fxlevy/.ssh/id_ed25519
Your public key has been saved in /Users/fxlevy/.ssh/id_ed25519.pub
The key fingerprint is:
SHA256:/e+TW7ftarreG1qC6fA/85jQUCD4JRULJGmvuu0FbTg fxlevy@MacBook-Pro.local
The key's randomart image is:
+--[ED25519 256]--+
| .++.+. |
| +..o.o |
| . o o. . |
| oo. . |
| E.S o |
| .+ * |
| . o + + o.o|
| .. . + .oO+o+|
| .oo ooOOOBo|
+----[SHA256]-----+Si vous le souhaitez, vous pouvez protéger la lecture de votre clé RSA avec un passphrase.
Pour plus d'information vous pouvez lire cette question/réponse.
La conséqunece sera qu'à chaque fois que vous utiliserez votre clé, le mot de passe qui la protège vous sera demandé. Celà peut être assez contraignant. Donc tout dépend de votre usage. Si vous êtes le seul à utiliser l'ordinateur qui stocke la clé et que l'accès à votre ordinateur est suffisamment protégé, ce n'est pas la peine de générer un passphrase.
Vous pouvez vérifer que votre paire de clés à bien été générée avec la commande:
ls -l $HOME/.sshqui renverra alors les deux fichiers:
-rw------- 1 fxlevy staff 419 31 mai 16:25 id_ed25519
-rw-r--r-- 1 fxlevy staff 106 31 mai 16:25 id_ed25519.pubLe fichier id_ed25519 contient la clé privée. Ne transmettez jamais ce fichier ni son contenu. Il permet de décrypter les messages cryptés avec la clé publique.
Le fichier id_ed25519.pubcontient la clé publique. C'est cette clé qui est utilisée pour crypter les messages. Elle ne peut pas être utilisée pour décrypter les messages. Donc la transmettre ou la montrer ne comporte aucun risque. C'est cette clé qui doit être envoyée sur la machine distante. vous trouverez ci-dessous un exemple du conteu du fichier généré pour la clé publique:
ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIHnyq1K0j0+P4st5LkNdYMC3aruB4BL1Jdep3/pEGyzF fxlevy@MacBook-Pro.localIl contient le type de clé, sa valeur et l'identifiant de l'ordinateur qui l'a générée.
Copier une clé publique sur une machine distante.
La copie d'une clé publique sur la machine distante se fait avec la commande suivante:
ssh-copy-id myuser@mydebian.locall'option myuser@mydebian.local détermine l'utilisateur de connexion ainsi que l'adresse de la machine distante dans lequel la clé doit être copiée.
Si vous ne spécifiez aucun paramètre supplémentaire la procédure va copier le contenu du fichier se trouvant à l'emplacement $HOME/.ssh/Ed25519.pub.
Pour plus d'information sur la commande ssh-copy-id, vous pouvez vous référez au Manuel de Debian.
La procédère se déroule comme suit:
/usr/bin/ssh-copy-id: INFO: Source of key(s) to be installed: "/Users/fxlevy/.ssh/id_ed25519.pub"
The authenticity of host 'mydebian.local (10.211.55.105)' can't be established.
ED25519 key fingerprint is SHA256:rj1hZi1J/aj3kotdJP7qfamOLIk/gMmk0gfL2mLxfO0.
This key is not known by any other names.
Are you sure you want to continue connecting (yes/no/[fingerprint])? yes
/usr/bin/ssh-copy-id: INFO: attempting to log in with the new key(s), to filter out any that are already installed
/usr/bin/ssh-copy-id: INFO: 1 key(s) remain to be installed -- if you are prompted now it is to install the new keys
myuser@mydebian.local's password:
Number of key(s) added: 1
Now try logging into the machine, with: "ssh 'myuser@mydebian.local'"
and check to make sure that only the key(s) you wanted were added.Lors de cette procédure de copie le mot de masse administrateur de la machine distante vous sera demandé. La clé sera copiée sur la machine distante dans le fichier $HOME/.ssh/authorized_keys. Si vous ne vous êtes jamais connecté à la machine distante, elle sera rajoutée dans le fichier $HOME/.ssh/known_host de votre Mac. Si ce fichier existait déjà il sera copié avant d'être modifié dans le fichier $HOME/.ssh/known_host.old.
Vous pourrez alors vous connecter à votre machine distante sans saisir le mot de passe d'administration avec la commande:
ssh myuser@mydebian.localConnecter VSCode à la machine distante avec une clé SSH.
L'article Remote Development using SSH décrit l'ensemble des activités à réaliser pour atteindre ce but. On commence déjà par installer l'extension Remote Development using SSH dans VSCode.
Une fois l'extension installée, vous pourrez vous connecter à votre machine distance en lançant la pallette de commande dans VSCode avec la commande '⌘⇧P' sur Mac, puis en choissant de lancer Remote-SSH: Add New SSH Host....
Connectez vous avec les même paramètres que ceux utlisés pour vous connecter avec le terminal. C'est à dire dans notre cas myuser@mydebian.local.
VSCode vous demandera dans quel fichier de configuration il doit ajouter la nouvelle définition de connexion.
Par défaut le fichier de configuration se trouve à l'emplacement $HOME/.ssh/config.
VScode vous proposera d'ouvrir ce fichier de configuration. Vous pouvez cependant accéder à ce fichier de confuguration en lançant Remote-SSH: Open SSH Configuration File... avec la Pallete de Commande.
Reprenez la définition de votre système:
Host mydebian.local
HostName mydebian.local
User myuserAjoutez à la définition de votre système le paramètre suivant:
PubkeyAuthentication yesSi vous n'ajoutez aucun autre paramètre, VSCode utilisera la clé publique stockée dans le fihcier `$HOME/.ssh/id_ed25519" pour s'autghentifier.
Si vous souhaitez préciser la localisation du fichier, ajoutez le paramètre:
IdentityFile ~/.ssh/id_ed25519La définition de votre système devrait ressembler à l'exemple ci-dessous:
Host mydebian.local
HostName mydebian.local
User myuser
PubkeyAuthentication yes
IdentityFile ~/.ssh/id_ed25519Afficher le contenu d'un répertoire distant aec VSCode.
Pour afficher un répertoire distant dans VSCode, il faut d'abord vous connecter à la machine distance la commande Remote-SSH: Connect to Host...de la palette de commandes. Utilisez la définition de votre machine distante pour vous y connecter.
Une fois que vous êtes connecté, VSCode s'affiche en indiquant qu'il est connecté via SSH sur votre machine distante ①. Vous pourrez à partir de cette fenêtre accéder à l'explorateur de fichier ②. Et enfin choisir d'afficher le dossier distant avec le bouton Open Folder ③.
Déterminer le point d'entrée de l'explorateur de fichiers. Par défaut il vous sera proposé le dossier Home de l'utilisateur distant.
La première connexion est assez longue car VSCode va installer un Serveur VSCode dans la machine distante afin de pouvoir communiquer avec elle. La configuration de ce serveur VSCode se trouve dans la machine distante à l'emplacement $HOME/.vscode-server. Cela est purement informatif car jen n'exploite pas les fonctionfonctions du serveur VSCode dans cet article.
Gérer votre projet avec GitHub dans VSCode.
GitHub est un site Web qui permet de gérer les projets de développements et de les paratager avec la communauté en s'appuyant sur l'outil Git. Parmis les fonctions les plus importantes on retrouve le gestion des versions, l'identification des différences entres version, la gestion des problèmes, la gestion des évolutions, la documentation et bien d'autres fonctions liés à la gestion de projets de développement.
Pour plus d'information sur `Git, je vous renvoie à sa documentation.
Connecter VSCode à Github.
Cet article considère que vous avez déjà créé votre compte sur GitHub. Si ce n'est pas le cas vous pouvez le créer en quelques clics à partir de cette page.
Dans la fenêtre de Visual Studio Code, vous pourrez observer que dans le la barre de boutons latérale il y a une icône permettant de gérer la connexion avec d'autres comptes ①.
Cliquez sur cette icône et choisissez Sign-In with GitHub to use Remote - Tunnels. Vous pouvez aussi lancer lancr la commande Remote-Tunnels: Connect to Tunnel... à partir de la palette de commandes et choisir ensuite GitHubdans la liste proposée.
Un message d'avertissement va s'afficher.
Apprès avoir cliqué sur le bouton Allow, la page de connexion à votre compte GitHub s'affiche dans votre navigateur.
Une fois authentifié, une page de confirmation du compte à connecter à VSCode s'affiche.
Cliquez sur le bouton Continue.
Si vous n'avez jamais connecté VSCode à Github sur votre compte, Une dernière page s'affiche vous demandant d'authorizer VSCode.
Cliquez sur le bouton Autorize Visual Studio Code.
Initialiser un Repo Git avec VSCode.
Git utilise la notion de Repo. Il s'agit du nom court pour Repository. Un Repo est un point d'entrée d'un projet de développement rattaché à votre compte GitHub. Vous y retrouverez toutes les fonctiones dont je vous ai déjà parlé, comme les versions, les demandes d'évolution... et bien sur le code source de votre projet.
Pour initialiser un Repo il faut avant toute chose Ouvrir votre dossier avec VSCode à partir du menu fichier de VSCode.
Cliquez sur l'icône Git dans la barre de menu latérale de VSCode ①.
Dans le panneau latéral de contrôle des source, cliquez sur le bouton Initialize Repository. Le menu latéral onique le nombre de fichiers à ajouter ①, dans le panneau latéral les fichiers concernés ②, et dans la fenêtre principale le code concerné ③.
Avant de cliquer sur le bouton Commit, il faut vous ajouter dans la configuration de Git pour votre projet - votre user et email Git. Pour celà, allez dans le menu Terminal de VSCode et cliquez sur l'option New Terminal. La fenêtre de terminal s'affichera en dessous de la fenêtre principale de VSCode.
Par défaut le terminal se positionnera au niveau du dossier de votre projet sur la machine distante.
Ajouter votre user email Git avec les commandes suivantes dans le Terminal:
Host mydebian.local
HostName mydebian.local
User myuser