Différences

Ci-dessous, les différences entre deux révisions de la page.

--- outils:vscode:liveshare [2020/03/22 12:55] – [Travail collaboratif dans VSCode] philippe
+++ outils:vscode:liveshare [2022/06/20 09:33] (Version actuelle) – [3. Initier (démarrer) une collaboration] phil
@@ Ligne 1: / Ligne 1: @@
+ [[:outils:vscode:accueilvscode|{{ :iconemaison.jpg?nolink&25|Sommaire VSCode}}]]
+==== IDE VSCode - Travail collaboratif ====
+[Mise à jour le 22/3/2020]
+  * **Source**
+    * <html><a href="https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack" target="_blank">Live Share Extension Pack</a></html>
+  * **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 <html><a href="https://outlook.live.com/owa/?ref=O365.Help" target="_blank">ici</a></html> 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|}}