私はフリーランスでソフトウェアエンジニアとして、バックエンドやインフラ面からアプリ構築を支援したりしています。

今回はマークダウン構文「Mermaid」について完全に主観でざっくりと書きます。

◇Mermaidとは
Mermaidとは、フローチャート、シーケンス図、クラス図、ガントチャート、およびgitグラフなど表現できるマークダウン構文です。
コードから良い感じのグラフを生成できるものになっています。
詳しくは下記URLを参照。
https://mermaid.js.org/

◇記法
シーケンス図
“`
sequenceDiagram
Alice->>John: Hello John, how are you?
John–>>Alice: Great!
Alice-)John: See you later!
“`

ER図
“`
—
title: Order example
—
erDiagram
CUSTOMER ||–o{ ORDER : places
ORDER ||–|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
“`
Notoinなど、対応しているサービスで、こんな感じで文字で書くことによって図が表現できます。

◇ここが便利
– 必要な図が、コードで書けること。(変更箇所の履歴が辿れる)
– 他のサービスでER図を書いて、画像出力して貼る、みたいな手間がない。
– 上記のことから常に最新である可能性が高い。

The following two tabs change content below.

• この記事を書いた人
• 最新の記事

中川 豪

最新記事 by 中川 豪 (全て見る)

• VScode拡張 “Rest Client”について - 2024年4月22日
• Dependabotについて - 2024年3月27日
• DDDについて - 2024年2月25日