[[:outils:vscode:accueilvscode|{{ :iconemaison.jpg?nolink&25|Sommaire VSCode}}]] ==== IDE VSCode - Travail collaboratif ==== [Mise à jour le 22/3/2020] * **Source** * Live Share Extension Pack * **Lectures connexes** * Pages d'accueil des wikis [[web:accueilweb|WebPEM]] et [[python:accueilpython|Python]] ---- === Préambule === L'extension **Live Share** pour VS Code permet de collaborer en temps réel ! Son utilisation nécessite de disposer d'une adresse mail avec un domaine Microsoft (outlook.fr, outlook.com ou hotmail.com) . Si vous n'en disposez pas rendez-vous sur la page de connexion d'Outlook ici pour en créer une. * Bouton **Connection** -> "Vous n'avez pas encore de compte ?" Créez-en un ! {{ :outils:vscode:creermail.png?nolink&300 |}} === 1. Installer l'extension VS Live Share === * Dans le gestionnaire d'extension {{:outils:vscode:icogestionnaire.png?nolink&25|}}, entrer //VS Live Share// et installer l'extension. Une fois l'extension installée, l'icône {{:outils:vscode:icolshare.png?nolink|}} apparaît dans la barre d'activité et l'icône ci-dessous dans la barre latérale. {{ :outils:vscode:lslaterale.png?nolink |}} * Installer également : * **Live Share Extension**, * **Live Share Chat** et * **Live Share Audio** === 2. Configurer un compte === * Cliquer sur {{:outils:vscode:lslateralemin.png?nolink|}} pour s'identifier. La page ci-dessous propose de se connecter. {{ :outils:vscode:connexionls.png?nolink&400 |}} * Après la connexion le compte de connexion apparait dans la barre latérale. Exemple : {{:outils:vscode:phills.png?nolink|}} * Ce compte peut être modifié en cliquant sur {{:outils:vscode:lslateralemin.png?nolink|}} puis **sign out**. === 3. Initier (démarrer) une session decollaboration === - **Ouvrir** un projet - **Cliquer** sur {{:outils:vscode:icolshare.png?nolink|}} - Dans {{:outils:vscode:ouvertsesssion.png?nolink|}} **cliquer** sur {{:outils:vscode:ouvertsesssion2.png?nolink|}} pour démarrer la **session de collaboration**.{{ :outils:vscode:ouvertsesssion3.png?nolink&500 |}} - Ok, un **lien de partage** a été mémorisé dans le **presse-papier**.{{ :outils:vscode:ouvertsesssion5.png?nolink |}} === 4. Envoyer le lien de partage === * **Ouvrir** un logiciel de messagerie et transmettre le lien de partage aux personnes avec lesquelles on souhaite collaborer. Exemple : https://prod.liveshare.vsengsaas.visualstudio.com/join?8DCC019FF7CCB2... === 5. Se connecter à une session === * **Ouvrir** le lien reçu par mail avec un navigateur. Une page s'ouvre comme sur la copie d'écran ci-dessous. * **Sélectionner** VS Code pour lancer la session de collaboration. {{ :outils:vscode:ouvertsesssion6.png?nolink |}} === 6. Attirer l'attention des participants === * **Cliquer** sur {{:outils:vscode:icolshare.png?nolink|}} * Dans {{:outils:vscode:ouvertsesssion11.png?nolink|}}, cliquer sur {{:outils:vscode:ouvertsesssion12.png?nolink|}} === 7. Fermer une session === * **Cliquer** sur {{:outils:vscode:icolshare.png?nolink|}} * Dans {{:outils:vscode:ouvertsesssion7.png?nolink|}}, cliquer sur {{:outils:vscode:ouvertsesssion8.png?nolink|}} === 8. Partager un terminal === * **Cliquer** sur {{:outils:vscode:icolshare.png?nolink|}} * Dans {{:outils:vscode:ouvertsesssion9.png?nolink|}}, cliquer sur {{:outils:vscode:ouvertsesssion10.png?nolink|}}