こんにちは。テックリードの私だ。
リモートワークが当たり前になった現代のソフトウェア開発において、もはや「画面共有の向こう側で喋るだけのペアプロ」は時代遅れだと言わざるを得ない。相手がタイプミスをするたびに「あ、そこじゃなくて一個上の行の……」と口頭で誘導する不毛な時間に、チームの貴重なリソースを溶かすのはもう終わりにしよう。
JetBrains製IDEに標準搭載されている『Code With Me』は、単なるリモート画面共有ツールではない。これは、ホスト側のパワフルなインデックス、型推論、静的解析の恩恵をそのままに、別拠点のメンバーと完全に同期された同一コンテキストでコードを叩き合える、極めて強力なコラボレーション・エンジンだ。
今回は、PhpStormにおけるCode With Meを軸に、単なる「繋ぎ方」の解説を超えた、チームの生産性を極限まで引き上げるプロの実践テクニックを伝授する。
—
1. なぜ「Code With Me」なのか?:アーキテクチャの優位性
世の中にはVS Codeの「Live Share」をはじめ、様々な共同編集ツールが存在する。しかし、PHP/TypeScript/Dockerが入り組んだモダンなWebアプリケーション開発において、PhpStormのCode With Meが頭一つ抜けているのには明確な理由がある。
- ホストの環境をそのまま共有: ゲスト側は重いDockerコンテナやローカルのPHPランタイム、巨大なVendorディレクトリを構築する必要がない。ホスト側のPhpStormが持つ強固な補完(IntelliSense)とデータベース接続がそのままゲスト側にも非同期で拡張される。
- 権限の粒度コントロール: 「コードは見せたいが、DBの接続情報や.envは触らせたくない」「ターミナル操作はホストだけに制限したい」といったセキュリティ担保が、エンタープライズレベルで可能。
このツールをチームの共通言語に組み込むことで、レビューのその場で修正が完了し、チケットのリードタイムを劇的に短縮できる。
—
2. 現場のプロが実践する:Code With Me 運用・設定のベストプラクティス
まずは、Code With Meを安全かつ最大限に活用するための「設定の共有化ルール」と、セッション運用の極意を見ていこう。
ゲスト権限の厳格なマッピング
野良セッションを乱立させないため、チーム内でのアクセス権限のポリシーをあらかじめ統一しておくべきだ。特にバックエンドを触る際は、意図しないマイグレーションの実行を防ぐために以下の設定を徹底する。
- コードの編集: 許可(同行者とのペアプロ用)
- ターミナルアクセス: 「読み取り専用」 または 「無効」 (※デプロイやDB操作は必ずホスト側で行う)
- アプリケーションの実行: 必要に応じて許可(ただし、テストランナーのみに絞るのが安全)
—
3. 開発スピードを劇的に高める:隠れたキーボードショートカット
Code With Me中、ホストとゲストの阿吽の呼吸を生み出すのが以下のショートカット群だ。これらを身体に叩き込むだけで、マウス操作による無駄なコンテキストスイッチが消滅する。
| アクション | Windows / Linux | macOS | 現場での活用シーン |
| :— | :— | :— | :— |
| 参加者への追従 (Follow Me) | `Ctrl + Alt + Shift + F` | `⌃ + ⌥ + ⇧ + F` | ホストが「ここを見て」と誘導したい時に強制的に画面を同期させる。 |
| コードの差分・ジャンプ先指定 | `Ctrl + B` (定義元へ) | `⌘ + B` | ゲストが自発的に該当のクラスへジャンプし、ホストを先導する。 |
| 音声通話のミュート切替 | `Ctrl + Alt + Shift + M` | `⌃ + ⌥ + ⇧ + M` | 内蔵音声機能を使用時のクイックミュート。 |
| セッションパネルの呼び出し | `Alt + 9` (Tool Window) | `⌥ + 9` | 参加者の確認や権限変更を瞬時に行う。 |
—
4. チームの共通インフラ:絶対入れるべき神プラグイン
Code With Meでのペアプロ体験をさらに昇華させるために、ホスト・ゲスト双方が導入しておくべきPhpStorm用プラグインを厳選して紹介する。
1. Key Promoter X
- 理由: ペアプロ中に自分がマウスをクリックするたびに、「今の操作は `Ctrl + Shift + N` でできたよ」と画面右下に通知を出してくれる。相手に見られているプレッシャーの中で、自然と美しいショートカットワークが身につく。
2. Nyan Progress Bar (※チームの雰囲気に合わせてお好みで)
- 理由: 長時間のセッションや重いテストの実行中、プログレスバーを猫が走ることで、ピリついたデバッグの雰囲気を和らげる隠れた名作。
3. Rainbow Brackets
- 理由: 複雑なLaravelのクロージャや配列が入り組んだコードを共同で追う際、ネストの深さを色で視覚化してくれるため、「今どのスコープにいるか」の認識ズレを防ぐ。
—
5. チーム開発で役立つ設定の共有化:`.idea` と設定ファイルの最適解
チーム全体でPhpStormの挙動やCode With Meの前提環境を統一するため、プロジェクトルートの `.idea/` ディレクトリ配下の構成を最適化する。個人のローカル環境に依存させないための設定ファイルのベストプラクティスを提示しよう。
`workspace.xml` の除外と `.gitignore` の作法
Code With Meの一時的なセッション情報や個人のウィンドウレイアウトがGitに混入すると、チームメンバー全員のIDE挙動が狂う原因になる。以下のルールを `.gitignore` に必ず記述すること。
— PhpStorm / JetBrains IDE Settings —
個人のワークスペース状態、開いているタブ、Code With Meの一時設定はバージョン管理から除外
.idea/workspace.xml
.idea/tasks.xml
.idea/usage.statistics.xml
.idea/dictionaries/
.idea/shelf/
共有すべきプロジェクト設定(コーディング規約、PHPのバージョン、Code With Meの基本ポリシー等)は含める
!.idea/php.xml
!.idea/codeStyles/
!.idea/qualityTools/
チームで共有すべきPHP/Laravel環境設定(`/.idea/php.xml` の例)
ホスト側がリモートペアプロを円滑に開始できるよう、PHPのインタープリター設定や品質ツールのパスをXMLで固定化し、チーム間で共有する。
—
6. 実践:リモートデバッグ手順の黄金フロー
Code With Me環境下で最も真価を発揮するのが、「Xdebugを用いたリモートペアプロデバッグ」だ。以下のステップをチームの標準ワークフローとして定着させてほしい。
1. ホスト側でブレークポイントを設置:
疑わしいコントローラーやサービス層のメソッドにブレークポイントを貼る。
2. Code With Meセッションの開始:
メニューバーの `Tools` > `Start Collaboration Session…` からリンクを発行し、Slack等でパートナーに共有する。この時、音声通話もPhpStorm内蔵のものを使用するか、Discord等の外部ツールを併用する。
3. ゲスト側の追従:
ゲストはリンクをクリックして参加後、ホストの画面に追従 (`Follow Me`) し、リアルタイムでリクエストのペイロードや変数のスタックトレースを二人羽織の要領で確認する。
4. 共同での値の書き換え・評価:
PhpStormの「Evaluate Expression (`Alt + F8` / `⌥ + F8`)」を使い、ゲスト側からでも式の評価や変数の変更を提案・実行できるため、「ここにこういう値を突っ込んだらどうなる?」という仮説検証が圧倒的なスピードで進む。
—
テックリードからの総括
Code With Meは、単なる「便利機能」ではない。これは、属人化しやすい複雑なレガシーコードの解析や、新メンバーのオンボーディングコストを劇的に押し下げる「組織の武器」である。
「教える側」と「教わる側」の壁を壊し、同じコードベースを同じ視座でリアルタイムにハックする体験は、チームの技術力を底上げする最も確実なアプローチだ。
明日からのスプリント、まずは15分のチケットリファクタリングから、このCode With Meをチームに導入してみてほしい。開発スピードの桁違いな変化に、きっと驚くはずだ。