開発チーム全体のタスクを依存関係をGviz(内部的にはGraphviz)で管理する
開発チーム全体の依存関係をGviz(内部的にはGraphviz)で管理しはじめました。
なぜGvizを利用したか、利点と欠点をまとめます。
必要とされること
開発チームの各メンバーの担当がそれぞれどのような影響を与え合っているかを
ひとめでわかる形でリモートで共有する必要があります。
はじめはホワイトボードに図を書いて写真をとって共有していたのですが、
状況は刻一刻と変わるためどんどん図を変更する必要がでてきました。
また、ホワイトボードは他の用途にも使うため常に書きっぱなしというわけにもいきません。
そのため、常に1から図を書き直すことになってしまいます。
以上のことから、情報共有ツールなどを通してリモートで共有しやすく、
変更に強い形式で依存関係を図に落とし込む必要がでてきました。
Gvizとは何か?
オープンソースのグラフ描画ツールであるGraphvizがあります。
GraphvizはDOT言語という専門言語で記載した関連を
各種画像フォーマットで出力してくれます。
GvizはDOT言語の代わりにRubyのDSLでグラフを描画することができます。
DSL自体もわかりやすいですし、Rubyの文法を活用できるので
定形処理の共通化なども容易です。
Gvizを使うと何が嬉しいか?
- GUIの描画ツールやホワイトボードを使う場合に比べ少ない手間で作図が可能となる
- 特に図の変更時のコストが低い
- ※この点はGraphvizの利点
- DOT言語に比べてわかりやすい文法
- DOT言語と異なりRubyの文法の力をそのままかりることができる
- ループ処理
- 共通化
詳しくはGvizの作者さんのサイトを参照ください
Gvizの目次 – Rubyの世界からGraphvizの世界にこんにちは!
また、私もGviz関連のサンプルコードをQiitaで公開しています
サンプル
例の内容は適当なもので、実運用とは関係ありません。
DOT言語の例
digraph G {
layout="dot";
overlap="false";
node[width="3",height="2",fontname="MS UI GOTHIC",style="filled",fillcolor="white"];
SpecWrite[label="仕様を記述する: プロダクトオーナー",fillcolor="skyblue"];
PrepareVagrant[label="Vagrantのローカル開発環境を用意する: インフラエンジニア",fillcolor="skyblue"];
PrepareStaging[label="Staging環境を用意する: インフラエンジニア",fillcolor="yellow"];
PrepareProduction[label="Production環境を用意する: インフラエンジニア"];
Develop[label="TDDでプログラムを実装する: アプリエンジニア",fillcolor="yellow"];
WriteE2ETest[label="E2Eテストを実装する: アプリエンジニア"];
DeployStaging[label="Staging環境にモジュールを配布する: アプリエンジニア"];
TestStaging[label="Staging環境でテストする: テスター"];
DeployProduction[label="Production環境にモジュールを配布する: アプリエンジニア"];
SpecWrite -> Develop;
PrepareVagrant -> Develop;
Develop -> WriteE2ETest;
PrepareStaging -> DeployStaging;
WriteE2ETest -> DeployStaging;
DeployStaging -> TestStaging;
PrepareProduction -> DeployProduction;
TestStaging -> DeployProduction;
}
Gviz DSLの例
require "gviz"
Graph do
global layout:"dot", overlap:false
nodes width: 3, height: 2, fontname:"MS UI GOTHIC", :style => :filled, :fillcolor => :white
active = { fillcolor: :yellow }
done = { fillcolor: :skyblue }
node :SpecWrite, {label: "仕様を記述する: プロダクトオーナー"}.merge(done)
node :PrepareVagrant, {label: "Vagrantのローカル開発環境を用意する: インフラエンジニア"}.merge(done)
node :PrepareStaging, {label: "Staging環境を用意する: インフラエンジニア"}.merge(active)
node :PrepareProduction, {label: "Production環境を用意する: インフラエンジニア"}
node :Develop, {label: "TDDでプログラムを実装する: アプリエンジニア"}.merge(active)
node :WriteE2ETest, {label: "E2Eテストを実装する: アプリエンジニア"}
node :DeployStaging, {label: "Staging環境にモジュールを配布する: アプリエンジニア"}
node :TestStaging, {label: "Staging環境でテストする: テスター"}
node :DeployProduction, {label: "Production環境にモジュールを配布する: アプリエンジニア"}
edge :SpecWrite_Develop
edge :PrepareVagrant_Develop
edge :Develop_WriteE2ETest
edge :PrepareStaging_DeployStaging
edge :WriteE2ETest_DeployStaging
edge :DeployStaging_TestStaging
edge :PrepareProduction_DeployProduction
edge :TestStaging_DeployProduction
save :"develop_flow", :png
end
画像出力の例
補足
Gvizは以下の様なことが苦手です。
- 細かな配置調整などは難しい
- 画像を多用した見栄えのする作図は難しい