この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
ペアプロやモブプロする時はどのように実施していますか？
みんなが1箇所に集まって同じディスプレイを見ながらペアプロするのが一般的かと思いますが、リモートワークや物理的な拠点が異なる場合など、なかなか集まることができないこともあるかと思います。
私自身も、東京と札幌で拠点が離れているメンバーとプロジェクトを進めているので、なかなか1箇所に集まることができません。
集まることができなくてもペアプロしたいと思い、Visual Studio Live Share を利用してみましたので、紹介させていただきます。
バージョン情報
- Visual Studio Code 1.39.2
- Visual Studio Live Share 1.0.826
事前準備
Visual Studio Live Share拡張をインストールします。
Live Shareを始める
画面左下のLive Shareリンクをクリックするか、Live Shareのサイドバーのリンクをクリックすることで、すぐに始めることができます。
初回起動時（未ログイン時）は、GitHubアカウントまたはMicrosoftアカウントでサインインする必要があります。今回はGitHubアカウントを利用しました。
GitHubのアクセス許可の設定を実施すると準備完了です。
セッション開始
Live Shareを始めると、共有のURLが発行されるので、ゲスト（ペアプロの相手）にURLを共有します。
Live Share拡張が未インストールの場合は、インストールを求められるので、インストールします。 インストール完了後、Live Shareが始まります。
誰がどこにカーソルがあるか？選択しているのか？エディタ上で表示され、とてもわかりやすいですね。なおモブプロを実施する際は、執筆時点で最大30台接続することができるようです。モブプロにも十分に利用できそうですね。
主要な機能
ここからは、Live Shareの主要な機能を解説していきます。
ライブ編集
接続しているすべてのユーザは、すぐにお互いの編集状況や選択状況をリアルタイムで見ることができます。サクサクカーソルが追従して、ストレスなく利用できます。
フォーカスとフォロー
接続しているユーザに、自分自身の作業内容を見てもらうことができます。注目〜！といった感じに、重要な処理の実装をみんなで確認しながら進めることができそうです。
ゲストのエディタは、ホストがフォーカスされた箇所に表示が移動します。
デバッグ
プログラムのデバッグを共同で行うことができます。ブレークポイントは、接続しているユーザ間で共有されるようです。うまく動かない時に重宝しそうです。
共有サーバー
ローカルで起動したWebサーバーを接続しているユーザーと共有できます。Webアプリケーションを実装している場合は、実際の動きを確認することができます。
今回は、Node.jsでローカルの3000ポートにWebサーバを起動し、ゲストのブラウザでローカルの3000ポートにアクセスしてみました。
アクセスできました。共有されていることを確認できました。
共有ターミナル
ホストしている端末のターミナルを共有することができます。現状の開発環境では、コマンドラインツールが使われていることがほとんどですので、パッケージのインストールやアプリケーションの実行など接続しているユーザーであれば誰でも実行することができます。接続モードは、Read-only（読み取り専用）、Read/Write（読み取りおよびコマンドの実行）から選択することができます。
音声
会話をしながら実装を進めることができます。この機能がないとチャットなどのテキストベースでの会話やその他のツールを利用した会話となるので、Live Shareの機能として提供されているのはありがたいですね。
さいごに
実際に実装をしている環境でそのままペアプロできるのは、とても楽に感じました。利用環境にも左右されるかと思いますが、動作もサクサク動き、ストレスなくペアプロできました。
思っていた以上によい体験ができたので、今後のペアプロにも利用していきたいと思いました。
ペアプロ、モブプロを実施する際に、Visual Studio Live Share を利用してみてはいかがでしょうか。
0
