富士フイルムソフトウエアはいかにして旧開
発手法を捨てて
GitHub Enterpriseを愛する
ようになったのか
2018/07/27
富士フイルムソフトウエア
大島一輝
大島一輝
»
富士フイルムソフトウエア
⋄
イメージングソリューションGr
»
経歴
⋄
2012年入社
⋄
画像処理コア技術開発
⋄
店頭写真注文受付機GUI開発
⋄
写真注文用スマホアプリ開発
1.
導入経緯
なぜGitHubを導入する必要があったのか？
富士フイルムソフトウエア
イメージングソリューショングループ
のミッション
5
7
富士フイルムフォトイメージング
事業のミッション
9
工場（生産拠点） データセンター お店 家 サーバ 生産 ユーザー/画像 クライアント PCソフ ト スマホ ソフト 店頭機 ソフト 画像補正 画像合成 注文 決済 ユーザー 管理 注文管理 画面表 示 画像保 管 バック アップ プリント 管理 プリント 出力 色補正 プリント 受付 配送情 報 管理 その場で受取 家でじっくり こだわる PCが使えない！
店頭受付ソフト
全国の写真店、家電量販店、小売店（東急ハンズ、ロフトなど）の店頭 で約8,500台稼働中。海外展開も。
ネット
課題
店頭とネット/スマホで技術が全く異なり、 開発環境が多種多様、動作も異なる
クロスプラットフォーム開発
ネイティブからWeb/ハイブリッドアプリケーションへ 極力部品を共通化し、並行開発 OS OS Web Browser Native Wrapper App AppHardware Chromium Embedded Framework
計画
15
複数商品、複数プラットフォームの並行開発となるため、 ソースコードのマージが適宜必要となる
始まってみると
» マージ作業が大幅なコストとなってしまった ⋄ マージする段階で品質が見えにくい ⋄ スケジュールの変更によりマージ範囲も変動 » 異なるプラットフォーム間の進捗が見えづらくなり、 開発効率の低下につながってしまったSVNのブランチ状態は混沌
を極めることとなる
同時多発する
trunk
内容の異なる
trunk
無駄に深いディレクトリ
Sources/trunk？
trunk/Source？？
19
立ち上がるリファクタリング
» 並行開発の末に悪魔合体を繰り返したソースコードに秩序を取
り戻すため、大規模リファクタリングを敢行
» 開発環境もリファクタリングできるチャンス ⋄ GitHubを導入したい、と現場の声
GitHubに漠然と期待した効果
» ブランチのマージコスト低下 » コードレビュー文化の繁栄 » CIツール、課題管理ツールなどとの連携なにより、GitHub、おもしろそうじゃん？
212.
導入に対する壁
23
GitHub.com
» 開発中のソースコードをインターネットに丸腰で置くのには抵抗が ある（社内ルール的にもNG） » GitHub.comのメンテナンスの影響を受けてしまう ⋄ 開発非効率 » 無料のGitHubクローンでは機能が物足りないGitHubEnterpriseの採用
» セキュリティはバッチリ ⋄ リポジトリごとの公開/非公開が設定できる ⋄ 万一の情報漏えいも影響範囲は社内のみ ⋄ ユーザのログイン・各種操作ログ取得可能 ⋄ 予期せぬダウンタイムの回避 » サポートツールが充実しており、 運用の負担はそこまで高くない ⋄ マクニカさんのサポートのおかげです 25Gitトレーニング
» Git未経験のメンバーに向けトレーニングを実施
» 基本的な使い方、ブランチ運用などドキュメントを整備 » 自分がGitHubおじさんとなって布教、サポート
» テキストファイルだけのリポジトリを作成し、GitHubを利用した開発
フローを経験してもらう
» キーワードはGitHubはSEにとってのSNSなんだよ！ » 実際に使って、慣れてもらうのが一番
29
クローン master 開発項目単位でブランチを作成 コーディング プッシュ ので、別ブランチで次の開 発 XXX YYY ブランチ
GitHub開発フロー
31
ブラウザ上でコードレビュー
ソースコード自体へ コメント(レビュー)
33
レビュー、修正、マージ
ボタンを押せば
本流へのマージが完了する レビュー内容を確認し、修正する
3.
導入効果
35
コードレビュー
効率化
コードレビュー・ビフォー
» FaceToFaceが基本。開発者のローカルにしかないソースコードを WinMergeなどのDiffViewerを用いて説明する
⋄ 時間、場所の制約が発生する
コードレビュー・アフター
» PRによるレビュー ⋄ レビュアーが自分のスケジュールに合わせて ブラウザ上でレビューできる 効率化！ ⋄ ブランチはPush済みなので、 開発者は次の開発を進められる 効率化！！ ⋄ PRがそのまま議事録となる 効率化！！！ 37ちょっとまって！
会社の風土に合わせる必要があった
» 弊社ではコードレビュー議事録の中に重要度の項目がある
（致命欠陥、重欠陥、軽欠陥、その他(改善要望等)）
⋄ PJの品質見える化、の観点では重要 » PRでは単にコメントとなり、それがわからない
どうやって解決した？
» 求められたゴールはPR毎に 以下のようなデータを得られること ⋄ 重欠陥XX件、軽欠陥XX件、、、 » せっかく効率化のために導入したGitHub、 レビュアーの負担は極力減らしたい » GitHubAPIを活用する ⋄ GitHubは機能の殆どをWebAPIとして提供している 39解決策
» リポジトリを指定し、期間、ラベルに関連するPRのコメントを 集計、CSV出力するWebアプリ(Angular + TypeScript) » GitHubPagesの機能を使って公開 ⋄ GitHubPages...GitHub上のファイルを静的なWebPageとし て公開できる機能 定型文を必ずレビュー後に入力 GitHubAPIを使って取得し、集計する41 各項目を適宜入力
ん？コメントいれるの忘れそう？
» 社内標準ツールGoogleChromeの拡張機能を自作
PRのレビュー欄にデフォルトで入力される
PRベースでの品質の見える化を達成！
» デイリーでPJの品質確認可能 （ソースコードレビューによる不具合の前倒し摘出） » 社内ルールにGitHubを溶け込ませることに成功した ⋄ 次はGraphQL APIへ対応したい 43 CSV各種ツールとの
各種ツールとの連携・ビフォアー
» 課題管理、静的解析ツール、CIツール、の連携が特になされて いなかった » 課題管理と結ばれていないから、なぜその修正が入ったか、 背景がわからない » マージするまでテストやビルドの結果がわからない 45マージコスト増
各種ツールとの連携・アフター
デプロイ自動化
が次の課題
● 課題管理
● 静的解析
● CI
● チャット
● リポジトリ管理
47
課題管理との連携
マージ時にコミットメッセージ に対応するチケットNo入力 Redmineに自動でリンク チケットに関連するコミットがすぐに分かるPRと連動し、自動テスト、静的解析を実施。マージ前の品質を 確保でき、レビュアーの負担が軽減 ⋄ 大量のマージに耐えられる開発体制 静的解析結果はPR上に表示 開発者はすぐに気づいて修正できる NGステータスの場合、 マージできない
49
チーム風土の変化
コードレビューの殺伐さが消えた
» 静的解析、自動テスト、各種ツールの活用、により
ストレスからの解放(効率化）と精神的安定を手に入れた
» コードレビューにも変化が起きた
コードレビューの殺伐さが消えた
» 良いコードには称賛を。気軽にイイネしあえる関係 » サンプルコードの提示、アドバイスも
⋄ ソースコードへのアクセスが容易
コードレビューの意識改革
» レビュアー VSレビューイ、から、解決しなければならない課題 VS チーム全員
という意識の変化が生まれた » 良い雰囲気は良いコードを生む 53VS
チーム
課題
チーム風土の変化
提案活動活発化
GitHubを運用して出てきた課題
» PRベースのコードレビューは便利だが、気づかぬうちに溜 まっていってしまう、ということも » レビュー漏れ(レビューしないとマージできないので、最終的 に漏れることはないが、スケジュールに影響を与える)が発 生 55若手エンジニアが自発的に課題解決
» レビュアー抽出・一覧化ツールを開発
⋄ GitHubのおかげで参考ソースへのアクセスが容易 ⋄ PRでのやりとりでモチベーションアップ
57
チーム風土の変化
改善活動活発化
早朝プチリファクタマラソン
» 自動テスト、静的解析でのチェック機構により、小規模な改 善がやりやすくなった » そこでチームで早朝プチリファクタリングマラソン、を実施した ⋄ 静的解析指摘、不足している自動テストの拡充、 など技術負債をコツコツ返済していくのが大目的» コーディングにかける時間は毎朝の15分 » 出来たらその日のうちにPR、レビュアーはその日のうちにレビューする。 貯めない » 改修量は50step以内 » レビュアーは改修内容にのみ集中する » 1stepでも改修できれば良い、という気持ちで 59
ルール
効果
» 静的解析指摘の修正、不足テストの追加によりデイリーで内
部品質が改善
61
技術課題の解決が加速
» GitHubは自由に試せる、すぐに共有できる場
» プロジェクト中に発生する様々な技術課題に対して、
プロト実装、レビュー、本番導入、 という流れができあがった
63
提案・プロト作成 議論・設計レビュー コードレビュー・マージ
