はじめまして。2019年に入社しました、開発の石原です。
軽く自己紹介をしておくと、高校理系→大学文系→就職先IT系（開発）という、よくわからない経歴の持ち主です。
普段は自社サービスのWebFile開発などをしています。
さて、記念すべき初投稿の内容は、モブプログラミングについてです。
先日、先輩二人とともにCodeZine Academyのリモート講座に参加しましたので、その時の体験についてレポートしたいと思います。
その名も、「チームで実践するリモートモブプログラミング講座」。
現在の時勢を鑑み、初のzoomでの実施とのことでした。
イベント情報はこちら
そもそもモブプログラミングとは
モブプログラミングとは、複数人で同じ画面を見ながらコーディングを行うという開発手法です。ペアプログラミングをご存じの方なら、その３人以上版だと思ってください。
１名が実際にコードを書く役（ドライバー）、残りの人は意見やアイデアを出す役（ナビゲーター）として一緒に作業し、役割は順次交代していきます。
モブプログラミングの特徴
モブプログラミングの特徴には、大きく２つの側面があります。教育的側面
みんなで一緒に開発をすすめるため、自分よりできる人のコーディングを見て学んだり、他の人にもっといい方法を教えたりするのに向いています。特にドライバーが初心者の場合、どこで躓いているのかが他の人から一目瞭然なので、必要なサポートがいつでもできます。その場ですぐに質問ができるので、聞きに行くハードルも下がりますし、状況説明にかかる時間も省けます。
効率化的側面
全員がその場にいるので、情報共有がスムーズです。仕様検討のための会議や、進捗確認などが一切いりません。みんなが知識を共有しているので、「〇〇さんがいないから仕様がわからなくて進まない」といった事態も回避できます。
テストケースの洗い出しや複雑な機能の実装方法検討などでも、一人で考え込むより遥かに多くの案があっという間に集まります。
また、一人だと見逃しがちなタイポや単純ミスが、それはもう親の敵のように指摘されます。
閉じカギ不足や変数名のミスによるエラーで１時間ハマったりしません。最高です。
さらにさらに、みんなで同じコードを使っているので、マージ作業も不要です。
コンフリクト修正のために未知のコードの仕様を１から確認しなくてすみます。
モブプログラミングに向いていないこと
単純作業や工夫が必要でない作業では、知識の共有によるメリットが活かせません。分業や個人作業とモブプログラミングを適宜切り替えながら作業を進めるのがよさそうです。
講義レポート
まずはレクチャーから
まずは、モブプログラミングの特徴ややり方についてのレクチャーを受けます。実際に導入している企業さんの例が映像を交えて紹介され、モブプログラミングとはなにかのイメージを掴んでいきました。
同じ空間にいるけれど個人作業OKだったり、全員リモート勤務でVSCodeのLive Shareを使ってコードを共有していたり、プログラミング以外の管理業務にも使ってみたりと、モブプログラミングと一口に言ってもやり方は千差万別なようです。
実際にやってみよう
一通りモブプログラミングについて理解したところで、いよいよモブプログラミングでの開発に挑戦です。お題は「自動販売機を作ってみよう」。
自動販売機のどの機能を作るのか、何の言語を使うのか、ドライバーの交代順やタイミングはどうするか……。
ほぼ何も決まっていないので、まずはとりあえずやってみて、随時軌道修正していきます。
今流行のアジャイル開発というやつですね。
開発時に使ったサービスは、MURALとRepl.itの２つ。
- MURAL
オンラインで使えるホワイトボードのようなサービスです。付箋を貼るような感覚で、タスクの管理やブレインストーミングのアイデア出しに使えます。
付箋の色や大きさを変えることも出来るので、「緑ということはあの人の意見だな」というような使い方もできそうです。
MURALのイメージ画像
- Repl.it
オンライン上でコードを実行・共有出来るサービスです。PHPやHTML、javascriptといった私が普段から慣れ親しんだ言語を始め、C++にRuby、Go、Swift、Pythonなど、とにかくいろいろな言語が使えます。今回は使用しませんでしたが、gitHubのリポジトリをインポートすることもできる模様。
実際のRepl．itの画面
この講座では、自動販売機に必要な機能をMURALに書き出し、それをRepl.it上でコードを作って動かしてみるというスタイルでモブプログラミングを進めていきます。最終的には、PHPを使って２時間で以下のような動きを実装しました。
- 値段の違う複数の商品が設定されている
- 買える商品がない場合は、投入金額と「お金を入れてください」のメッセージが出る
- お金を入れると、買える商品の一覧が出る
- 数値を入れると、その金額が投入される
- 商品名を入れると、その商品名が出力され、投入金額が商品の値段分減る
- exitを入力すると、お釣りが出る
ナビゲーターからの意見や指摘が出るわ出るわ。
わからない箇所があっても使えそうな情報があちこちから降ってくるので、思考がフリーズして手が止まるということがありませんでした。
振り返り
今回は開発開始一時間後と終了後の２回、自分たちのモブプログラミングのやり方を振り返りました。今のやり方について意見を出し合い、より自分たちに合ったスタイルに変えていきます。今回は、ドライバー交代のタイムキーパーや画面や参考サイトの共有方法などについて途中で変更してみたので、後半はよりスムーズに進められました。
質疑応答
最後は質疑応答の時間です。少し試しただけではわからないモブプログラミングについての疑問点について、講師の方からお答えいただきました。
感想
人数の関係で他の企業の方も交えた開催だったのですが、初対面とは思えない程にスムーズかつ和やかなコーディングでした。自分の知らない関数や、誰が見てもわかりやすい変数名の定義、どんどん洗練されていくコードの構造など、見ていて楽しかったです。
ただ、普段使っているショートカットやスニペットが使えないのはちょっと不便でした。VSCodeのLive Shareを使う方法は、自分のカスタマイズをそのまま活かせるので良さそうです。
既にある大規模サービスの開発にいきなりモブプログラミングを導入するのは難しそうなので、部分的なリニューアルや新機能追加の際にモブプログラミングを使ってみて、少しずつ情報共有の範囲を広げていくのが現実的でしょうか。
社内で試してみるという話もあるようなので、実施した際にはまたご報告します。
キー・ポイントでは、いろいろなことに挑戦する意欲のある方を募集しています。
