Code With Meでリモートペアプロをしよう！

去年の12月に虎の穴ラボに入社した、tora_kogaです🎊

私の入社前のKPTで、新しくチームに加わったメンバーにはやく馴染んでもらい、戦力になってもらうために、ペアプロをしよう！という流れになりました。

（一人でコードリーディングは辛いし、時間もかかってしまうので、、、）

IntelliJ IDEAで便利にペアプロができるプラグインがないか探したところ

IntelliJ公式の「Code With Me」が便利だったので、インストール方法や使い方、使用感をまとめました。

導入したいと考えている方の参考になれば、、、と思います。

0. 前提条件

ペアプロのドライバ役の人はホスト、ナビゲータ役の人はクライアントとして進めます。

IntelliJ IDEAは日本語化済です、英語の場合は読み替えてください。

※ 当記事は、macOSを想定して記述します。

1. 準備

環境

ホスト側に IntelliJ IDEA 2020.2 以上のインストール（Community可）が必要

Code With Meプラグインのインストール

ホスト側のIntelliJ IDEAに、Code With Meのプラグインを追加して再起動します。

IntelliJ IDEAの「Preferences」を開き、プラグインの「Marketplace」で「Code With Me」と検索すると、

「Code With Me」プラグインが出てくるのでインストールします。

クライアント側は、事前の準備は必要ありません。

後述のホスト側からもらった招待URLを開くと、専用アプリのインストールを促されます。

IntelliJ IDEAをインストールしていない人にも優しい仕組みです。

2. 接続する方法

ホスト側

メニューバーの人型のアイコンをクリックして、「アクセスを有効にして招待リンクをコピー」を選択します。

アクセス有効化とセッションの開始ウィンドウが開くので、クライアント側に必要な権限を付与して「有効化アクセス」ボタンを押します。

「Automatically start voice call」を有効にすると、接続後にビデオ通話が自動的に開始されます。

その後、しばらくするとクリップボードにURLが挿入されるので、

Slackや、Microsoft Teams、Discordなどでクライアント側（ナビゲータ役の人）にURLを送ります。

誤って、SNS（Twitterなど）でURLを共有しないように注意しましょう。

クライアント側

ホスト役の人から送られてきたURLを開きます。

ブラウザが開きコマンドの入力を求められるので、クリップボードにコピーして、ターミナルに貼り付けて実行します。

初回の場合、専用のビューワーアプリがインストールされます。

アプリが起動したら、プライバシーポリシーに同意します。

その後、ホストへの接続待ちになります。

ホスト側

クライアント側がプライパシーポリシーの同意まで終わったら、接続を受け入れるかどうかの確認ダイアログが表示されるので

「了承」を選択します。

これで、接続ができました。

3. ビデオ通話やチャットをする方法

Code With Meのみで、ボイスチャットだけではなくて、ビデオ通話ができます。

ビデオ通話をする場合は、左下の「Code With Me」のタブを選ぶと、
カメラ画像やチャットができるウィンドウが、IntelliJ IDEAのウィンドウ内に表示されます。

歯車ボタンを押して、「Float」や「Window」を押すと、下記のように個別のウィンドウになります

下の方にあるマイクやビデオのアイコンをクリックして、ビデオやボイスを個別で有効にできます。

マイクやビデオのアイコンの右下にある▼のアイコンを選ぶと、マイクやスピーカー、ビデオにどのデバイスを使うかを選ぶことができます。

4. フォローする方法

ドライバー役の人が書くコードを見たい時や、ナビゲータ役の人が指南するコードを見たい時などに相手のコードを追うことができます。

メニューバーにCode With Meで接続すると、接続している人のアイコンが追加されるので

アイコンをクリックします。

5. 使用感・雑感

よかったところ

IntelliJ IDEAのみでビデオ通話とコード共有ができるので、リモートワークで気軽に使える
音声通話やビデオ通話の品質が思ったより良い
Slack、Google Meetの画面共有に比べると、コードが綺麗に見える
コードを操作して教えてもらったり、教えたりできる

気になったところ

いつの間にか、フォローが外れてることがある（止まってると思ったらフォローが外れてる）
USBカメラの認識が切れて、ビデオ通話ができなくなることがある（IntelliJ IDEAの再起動でなおる）
IntelliJ IDEAのファイル内検索（⌘＋Shift＋F）のウィンドウが共有されないこと
実験的な機能（EAP）であること

まとめ

Code With Meは、音声通話やビデオ通話の品質も良くて思ったより使えそうと感じました。

また、今度は同じ案件を複数人で開発するときに、

Code With Meを使用してモブプロしたら、効率が上がりそうだなと感じました。

最後まで記事を見ていただいて、ありがとうございます！