メニューを閉じる

テクノモバイルグループ

メニューを開く

2019.11.20

開発環境・ツール

yUMLとの邂逅(紹介編)

こんにちは結構太った山根です。

社内歩いてると「太りました?」って言われます。ラーメンは白米のおかずです。

 

「yaml」ではなく「yUML」というのをご存知でしょうか?

私は初めて知りました。テキストで書いて出力すると、図1のような図が出力されます。

(幅どうやって変更するんだろう)図1:初めてのyuml

このyUMLでは、

クラス図、ユースケース図、状態遷移図、シーケンス図等が描画できます。

この環境と拡張機能で使えます!

使用する環境:VScode

使用する拡張機能:yUML(図2)

図2:拡張機能

やったこと

「yumltest.yuml」というファイルを作り、図3を記述

図3:作成したyUML

 

1.「type」で図のタイプ(クラス図、状態遷移図、シーケンス図等)を選択します。

(今回はシーケンス図)

2.「generate」で「.svgファイルを生成するかどうか」

3.フロー図を描いていく

4.作成したら、VScodeの右上にあるボタンを押す(図4参照)

図4:右上にあるボタン

5.図が出てくる!(図5参照)「yumltest.yuml」と同じディレクトリに「yumltest.svg」(図1)が生成されている!

図5:生成された図

 

図3に戻りますが、「>」で→に、「.>」で左に行きます。



にしてみるとどうなるんだろう?(「.」を抜かしました)

図6:変更した図

図5と図6を比べて、「—->」が変わっているのがわかりました。

 

yUMLのwikiです(あんまり見てなかった…)

https://github.com/jaime-olivares/yuml-diagram/wiki

次回はwikiを見ながら別の図や、もう少し深堀してみたいと思います。


【テクノモバイルではエンジニア/デザイナーを積極採用中です!】

下記項目に1つでも当てはまる方は是非、詳細ページへ!
  • 自分でアプリを作ってみたい
  • ITで世の中にワクワクを生み出したい
  • 使いやすさ、デザインにこだわったWebサイトを開発したい

採用情報の詳細はこちら


Qangaroo(カンガルー)

  • 徹底した見やすさと優れた操作性で、テストの「見える化」を実現。
  • テストの進捗が見える。開発がスマートに進む。
  • クラウド型テスト管理ツール『Qangaroo(カンガルー)』
https://qangaroo.jp/

最近の記事

SNS共有

X CLOSE
X CLOSE
X CLOSE