PlantUMLでUMLを書く

分析、設計においてUMLは強力なツールになります。 UMLは図で表すので文章だけに比べて理解しやすいです。

PlantUMLについて紹介したいと思います。

PlantUMLとは

PlantUML は、以下のようなダイアグラムを素早く作成するためのコンポーネントです。

• シーケンス図
• ユースケース図
• クラス図
• アクティビティ図
• コンポーネント図
• 状態遷移図（ステートマシン図）
• オブジェクト図

図を書くツールですが、文字列の組み合わせで図を自動的に作ることができます。

ソースコードを書くように図が書けます。

何が一番メリットかというと、画像を作っているものをテキストとして扱えるということです。

テキストで扱えるということはバージョン管理でき差分がわかるようになるということです。

PlantUMLのサイト

下記がPlantUMLを説明してあるサイトです。

http://plantuml.com/ja/

また、書いたPlantUMLのテキストをオンラインサーバーに送って画像として表示または出力するページもあります。

気軽に使いたいときにはこのページを使うと良いでしょう。

オンラインで書いて出力できるページ　 http://www.plantuml.com/plantuml/uml/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000

エディタ＋PlantUML

業務で使う場合などはオンラインサーバーに送りたくない場合もあるでしょう。

VSCodeやatomなどで使用できます。

インストール方法は「エディタ名 PlantUML」などで検索すれば見つかるでしょう。

VSCodeは下記を参考にしたらいいんじゃないかな。

Visual Studio Code で UML を描こう！ - Qiita

実際に書いてみる

冒頭のクラス図は以下のように書くと作れます。

@startuml
title クラス図
class people {
    -name
    -age
    +GetName()
    +GetAge()
}

class car {
    +typeName
    -color
    +GetTypeName()
    -getColor()
}
note "注釈文" as carNote
car .right. carNote

class money
{
    +type
    +Use()
    {static} yen
    {abstract} GetType()
}

car -left- people:乗る <
money -up- people:持つ <
@enduml

うん、これで図が描けるのはいいですね。

詳しく説明はしないので、PlantUMLのクラス図のページを見て実際に書いていってください。

シーケンス図も書いてみました。

仮想の課金処理のシーケンス図です。

@startuml
title 課金処理のシーケンス図

participant アプリ
participant サーバ
participant ストア

activate アプリ

アプリ -> ストア : 決済要求
ストア --> アプリ : レシート

アプリ -> サーバ : レシート
activate サーバ

サーバ -> ストア : レシート
activate ストア

ストア -> サーバ : 検証結果
deactivate ストア

サーバ -> サーバ : 結果保存

サーバ -> アプリ : 結果
deactivate サーバ

@enduml

シンプルに書けるようになっていることがわかります。（処理自体がシンプルということもあるのですが）

まとめ

PlantUMLについて紹介しました。

とにかくこういうのは自分で実践してみないことにはわかりません。

設計って難しいそう、とっつきづらそうなどという前に、手を動かしてみましょう。

そうやっているうちに痛い目も見てレベルアップもして、気が付いたらできなかったことができるようになっている。

そういうものですよ。

たぶん。