VSCodeでのリモート共同開発にLive share
はじめに
リアルタイムのコードレビューや共同開発に最適なLiveshare機能を紹介します。
使用感としてはfigmaの共同編集に近く、VSCodeの拡張機能として利用でき、簡単に導入できます。
Liveshareの導入方法
ステップ 1: 拡張機能のインストール
Visual Studio Codeを開きます。
左サイドバーの「拡張機能」(四角に矢印が入っているアイコン)をクリックします。
検索バーに「Live Share」と入力し、検索結果から「Visual Studio Live Share」を見つけます。
「インストール」ボタンをクリックして拡張機能をインストールします。
ステップ 2: Live Shareにサインインする
Live Shareのすべての機能を利用するには、MicrosoftアカウントまたはGitHubアカウントでサインインする必要があります。
VScodeの左下にあるLive Shareのアイコンをクリックします。
ポップアップウィンドウが表示されたら、「サインイン」を選択します。
MicrosoftアカウントまたはGitHubアカウントでサインインします。
ステップ 3: セッションの開始
Live Shareの拡張機能をインストールし、アカウントにサインインしたら、すぐにセッションを開始できます。
VScodeの左下にあるLive Shareのアイコンを再度クリックします。
「セッションを開始」を選択します。初めてセッションを開始する場合は、ファイアウォールの設定を変更するよう求められることがあります。
セッションが開始されると、招待リンクが生成されます。このリンクを共同作業者と共有することで、セッションに参加してもらうことができます。
ステップ 4: セッションへの参加
他のユーザーが開始したLive Shareセッションに参加するには、招待リンクが必要です。
招待リンクを入手します。
VScodeのLive Shareの拡張機能から「参加」を選択し、招待リンクを貼り付けます。
「参加」ボタンを押してセッションに参加します。
他機能との比較
画面共有とLiveshare
画面共有のメリット
- LINEやzoomなどで誰でも使いやすく、導入の手間がないため非常に楽です。Liveshare導入後もカジュアルに使います。
画面共有のデメリット
- レビュワーがコードを編集できないため、「何行目の〜っていうコード」のような説明が多発します。
- ツールによっては操作を相手に譲ることはできるが、操作が重くなりがちです。
リモートデスクトップとLiveshare
リモートデスクトップのメリット
- レビュワーがソースコードや参考Webサイトを見せながら説明できます。
- コーダーが席を外していても操作できます。
リモートデスクトップのデメリット
- 基本的にコーダーとレビュワーが同時に操作することはできません。
- 導入に一定の手間と知識が必要で、設定が不慣れな人が多いです。
- VSCode以外のアプリ・ブラウザにアクセスできてしまうため、プライベートな情報にもアクセスできます。
- 気軽に導入しづらい最大の理由として、セキュリティ上お勧めできません。
以上は、あくまでプログラミングのみの視点で考えられるメリットとデメリットです。
いずれかしか使わないのではなく、状況に応じて使い分けましょう。
参考
Visual Studio Live Share（公式ドキュメント）
VisualStudioとVSCodeのLiveShare機能について紹介
Discussion