Mermaid記法でダイアグラムを作る — フローチャート・シーケンス・ER図の書き方
Mermaidはテキストでダイアグラムを記述できる記法で、GitHubのMarkdownやNotion・Obsidianなどで直接レンダリングされます。グラフィックツールを使わずコードでダイアグラムを管理できるため、ドキュメントをコードと一緒にバージョン管理するのに適しています。
フローチャートの基本
flowchart LR（左から右）またはTD（上から下）で始め、ノードと矢印を記述します。A[テキスト]（矩形）・A(丸角)・A{分岐}・A((円形))などでノード形状を変えられます。A --> B（実線矢印）・A --- B（実線）・A -.-> B（点線矢印）で接続します。A -- テキスト --> B でラベル付き矢印になります。
シーケンス図の書き方
sequenceDiagramで始め、participant（参加者）とメッセージを定義します。User->>Server: リクエスト のように参加者名とメッセージを書きます。ダブル矢印は実線・->>は点線です。activate・deactivateで処理中の時間帯を表現でき、loop・alt・optでループや条件分岐を表せます。
ER図とクラス図
erDiagramでエンティティとリレーションシップを定義できます。User ||--o{ Order : places のように書くと1対多のリレーションを表せます。classDiagramではclass定義・継承・実装関係を描けます。システム設計のドキュメント化やデータベース設計の共有に役立ちます。
ガントチャートとPie・Git Graph
ganttでプロジェクトスケジュールのガントチャートを作れます。section・task・日付を指定してタイムラインを描きます。pieでは円グラフを即座に作成できます。gitGraphはgitのブランチ戦略を可視化するダイアグラムで、feature・main・developブランチの流れを表現できます。Mermaid Previewではリアルタイムプレビューしながら記述を確認できます。