最近の(フロントエンド)のチーム開発状況


こんにちは、hondam です。
ファーストサーバではフロントエンドの開発を担当しています。

今日は"ファーストサーバのなかのひと"としてAdvent Calendarの2日目用に投稿します。

さて、ファーストサーバでは今年の2月にホスティングサービスを刷新、「Zenlogic」というサービスをリリースしましたが、その際に所謂コントロールパネル(メールやFTPアカウントの作成、データベースの設定等を画面から行う専用のWEBアプリケーション)もリニューアルされました。

主なアーキテクチャやツールのリニューアル前後の比較です。

  Before After
言語 Perl/PHP Ruby
フレームワーク 特になし Ruby on Rails
フロント用フレームワーク 特になし React/Redux
バージョン管理 Subversion Git(GitHub)
ブランチモデル なし GitHub Flow
かんばん なし ZenHub
CIサーバ なし Jenkins
テストサーバ なし Docker
開発手法 ウォーターフォール スクラム
コミュニケーション IRC/メール Slack
ノウハウ共有 Wiki Qiita:Team
開発OS Windows Mac
端末 PC MacBook Air

Beforeの状況はちょっと大げさですが、リアルにこんな状況でした。
Afterを見てもらうと、割とモダンな構成になっているのがわかると思います。

IssueをZenHubで管理しつつ、最短1週間スプリントでどんどんコントロールパネルの改善を行っていきます。
振り返りは2週間に1度ですね。プランニングポーカーは定着しなかったです。

ZenHubを採用したのは、GitHubのデフォルトのIssueが状況を把握しづらかったためです。アナログなかんばんにしなかったのは、社内の座席が離れているためかんばん前に集まるのが面倒だったり、以前にも何度かトライしつつも定着しなかったのが理由です。

ちなみにZenHubのパイプラインは次のように分けています。

パイプライン名 概要
Backlog Issue作成直後
In Milestone Issueのマイルストーンが決まった場合
In Progress 実装中
In Review Pull Requestのレビュー中
Sandbox Sandbox環境にデプロイした
Sandbox OK Sandbox環境でのテストが完了した
Backstage Backstage環境にデプロイした
Backstage OK Backstage環境でのテストが完了した
Done Staging環境へのデプロイ準備が完了

かんばんアプリの場合はこういったパイプライン分けも手軽に行えるのが魅力です。
他候補としてはWaffleやHuBoard、Trello等ありましたが、GitHubのIssueとの連携が強力だったのでZenHubを採用しました。(デメリットはChromeの拡張機能なのでChromeを使わないといけないことですね)

ブランチモデルはGitHub Flowを採用しているので、基本的にPull Requestベースの開発となります。デプロイはDocker環境(テストビルド)、Sandox, Backstage, Staging, Productionの順になります。Productionまでに各環境でテストが行われます。

コミュニケーションは基本的にSlack上で行い、GitHubやJenkins等様々なサービスと連携しています。Slackは2年近く使ってます。最初は開発チームのコミュニケーション改善を目的に導入しましたが、今ではほぼ全社的にSlackでコミュニケーションをとっています。特に運用のルールは設けていません。チャネルは個人単位(分報用)からプロジェクト、機能、アプリケーション、部など様々な単位で設けられています。

とまぁこんな感じで最近のファーストサーバのフロントエンドは開発されています。
以前に比べ、格段にリリース頻度が増え、品質への取り組みも充実しています。

今後も継続的にZenlogicのコントロールパネルは改善されていきますので、注目してみてください。