VSCode : du pair-programming à distance avec Live Share

Stéphane

Stéphane, Développeur et responsable équipe front-end et mobile 1 octobre 2020

En tant que développeurs, il nous arrive fréquemment de faire du pair-programming : une méthode de travail en binôme grâce à laquelle nous travaillons côte à côte pour de meilleurs échanges. Chez Novaway, nous apprécions tirer profit de cette méthode dès lors que les projets s’y prêtent. Cependant, le récent accroissement du télétravail nous a demandé de repenser nos process afin de rester efficaces en duo, même à distance. De nombreux outils existent mais sont souvent imparfaits et pas vraiment pratiques.

Dans cet article, nous allons vous présenter une extension de l’éditeur VSCode - développée par l’équipe de Microsoft - qui répond parfaitement aux besoins du pair-programming à distance. Cette extension s’appelle Live Share.

Principe de Live Share

Live Share est basée sur la technologie WebRTC. Un hôte devra créer une session (appelée session de collaboration) à laquelle un ou plusieurs participants peuvent être conviés.

Cette session va offrir plusieurs types de chanels : texte, audio et partage de l’éditeur de l’hôte. Le partage possède un mode lecture seule, désactivé par défaut, qui peut être activé à tout moment.

Pour qu’un invité puisse rejoindre la session hôte, une URL de partage est générée et doit être envoyée à chaque participant. Par défaut, un invité rejoint la session sans approbation de la part de l’hôte.

Live Share ne s’arrête pas là. En plus des fonctionnalités citées précédemment, l'extension permet de partager son serveur local ainsi que le terminal de l’éditeur en lecture seule ou lecture/écriture. On est pas bien là ?

Jetons un oeil au process pour démarrer une session en lecture/écriture.

Une collaboration en temps réel en 4 étapes

1. Installation de l’extension

La première étape est classique : il faut commencer par installer l’extension Live Share depuis l’onglet VSCode ou directement en ligne de commande. Un petit rechargement de VSCode sera nécessaire après l’installation de l’extension.

Pour utiliser Live Share, un compte Github ou Microsoft est requis au démarrage de l’extension. Ce compte sert d’identification lors des différentes collaborations.

Pour vous connecter, vous pouvez utiliser l’outil de commande graphique de VSCode ou directement l’icône Live Share en bas à droite de l’éditeur.

2. Créer et partager une session

Une fois connecté, l’étape suivante consiste à créer la session à partager avec une ou plusieurs personne(s). Le process est identique à l’étape précédente : vous avez le choix d’utiliser l’outil de commande de VSCode ou directement l’onglet Live Share de l’éditeur.

Si aucune session n’est lancée, 3 boutons se présenteront : les deux premiers, comme indiqué, permettent de créer et partager une session Live Share avec les permissions indiquées.

Le dernier bouton permet de rejoindre une session déjà créée. Pour cela, il vous faudra être en possession de l’URL de la session générée par l’hôte.

pair programming à distance avec Liveshare

3. Partager son serveur local

Il est plus compliqué de visualiser le rendu de la session hôte en pair-programming à distance. Live Share règle complètement le problème en permettant à l’hôte (uniquement l’hôte) de partager son serveur local. Une fonctionnalité extrêmement pratique !

Depuis l’onglet Live Share, Share server va vous permettre de partager une URL locale avec l’intégralité des collaborateurs.

Une fois l’URL partagée, celle-ci apparaîtra dans la liste Shared Servers et les participants n’auront plus qu’à la sélectionnée.

4. Partager son terminal

Dernière grosse fonctionnalité de Live Share : le partage du terminal. Quoi de mieux pour apprendre à quelqu’un comment utiliser certains outils en ligne de commande ? Comment utiliser npm & co ? Comment démarrer un projet ? Et beaucoup, beaucoup d’autres cas d’utilisation.

Toujours depuis l’onglet Live Share et le détail de la session, vous y trouverez Share Terminals, toujours avec la possibilité de lecture seule ou lecture/écriture.

Conclusion sur Live Share

Chez Novaway, les utilisateurs de VSCode ont pleinement adopté cette extension. Elle permet, en plus du pair-programming, d’aider à distance en cas de problème. L’accès à l’éditeur, le serveur ainsi que le terminal nous permettent de s’abstraire complètement de la distance qui peut être problématique dans ce genre de situations. Cette extension peut potentiellement changer la façon dont nous abordons la collaboration, le débogage, etc.

Pour les fans de PHPStorm, la team JetBrains a très récemment publié l’extension Code With Me qui est encore en version bêta. L’extension propose des fonctionnalités similaires à Live Share : création d’une session qui permet le partage de l’éditeur et du terminal avec un ou plusieurs collaborateurs. Il n’est cependant pas encore possible de partager le serveur local de la machine hôte.