はじめに

Live Share Extension Packは、VScodeで複数人で共同編集（コード編集・デバック）ができる拡張機能です。リモートワークでの使用はもちろん、エラーの修正を複数人でフィードバックしながら行う際にも有効です。

Live Share Extension Packに含まれる拡張機能は以下になります。

拡張機能	概要
Live Share	使用しているプログラミング言語や作成しているアプリの種類に関係なく、他のユーザーとリアルタイムで共同で編集・デバックを行うことができます
Live Share Audio	別のツールやサービスを使用せず、VScode内から直接音声通話をすることができます

料金は無料なので、VScodeをインストールした際には最初に入れておくのが良いかもしれません。

ゴール

今回はLive Share Extension Packを導入し、実際に使用するところまで行いたいと思います。

手順

手順はざっくり以下の３つです。

1.インストールする
2. 設定
3. 共同編集

1. インストールする

Live Share Extension Pack

上記のリンクをクリックすると以下の画面が表示されますので、インストールをクリック。

VScode内に下記のアイコンが表示されれば正常に完了しています。

2.設定

Live Share Extension Packを使用するには、アカウントの設定が必要になります。

先ほどのLive Share Extension Packアイコン（画面左）をクリック。
セッション詳細の項目が出てきます。

共有（読み取り/書き込み）をクリックすると、画面上部に「Sign in するアカウントを選択してください」と表示されます。

アカウントは、「Microsoftアカウント」または「GitHubアカウント」の2つから選べるのでお好きな方をお選びください。
（筆者はMicrosoftアカウントを使用します）

アカウントの選択画面に移ります。（MicrosoftならMicrosoft、GitならGit)

下記の画面が表示されればアカウントの設定は完了です。

3. 共同編集

それでは、実際に共同編集を行ってみます。
まずは、編集を一緒にしたい方に招待を送る必要があります。

先ほどのLive Share Extension Packアイコン（画面左）をクリック。
セッション詳細の項目が出てきます。

共有を選択すると今度は共有の招待URLが発行されます
※画面右下に下記が表示されていれば発行されています。

後は発行されたURLをお相手に送れば完了です。

受け取り側はURLをクリックすると以下の画面に移ります。

「Live Share for VS codeを開く」をクリック。

共同編集可能なVScodeに移行しました！
こちらで全ての準備が完了です。

4.便利な機能

コメント

コメントは共有されたVScode内で行えるチャット機能です。
リアルタイムでチャットが可能なので、編集していても他のチャットサービスを使う必要がありませんね！！

参加者をフォローする

共同編集に参加したゲストは、何もしなければホストがフォーカスしているウィンドウに自動的に切り替わり、ホストのカーソル位置や入力を許可できます。
特定の誰かをフォローしたい場合は、Live Share ビューの「Participants」からユーザーを選択し、〇アイコンをクリックするか、コンテキストメニュー（右クリックで表示）の「参加者をフォロー」をクリックしてください。

参加者との音声通話

「Live Share Audio」を使用すると、メンバー同士で会話が可能です。

Live Share ビューの「Start audio call」を選択することで、音声通話の参加や開始が可能になります。

コラボレーションセッションの退席・終了

共同編集を終了したい場合は、Live Share ビューのセッション詳細の書きアイコンをクリックします。

さいごに

実際に使ってみると便利な拡張機能というのが理解いただけるかと思います！

・作業を分担したいとき
・ペアプロをしたいとき
・編集しながらチャットでやり取りしたいとき

などなど活躍する場面は多いと考えられます。
ぜひ、ご活用ください。