コンテンツにスキップ

サンプル

このセクションでは、本プロジェクトで使用する各種ツールの利用方法とサンプルを紹介する。

ツールの使い分け

Mermaid(推奨)

テキストベースで図を記述するツールである。以下の理由から、基本的にはMermaidの使用を推奨する。

  • AIが解釈・生成しやすい
  • バージョン管理が容易(差分が見やすい)
  • コードレビューがしやすい

Draw.io(限定的に使用)

VS CodeのDraw.io Integration拡張を使用する。

使用する場面

  • Mermaidでは表現が難しい複雑な図
  • 接続線の位置を細かく制御したい場合
  • 自由なレイアウトが必要な場合

注意

AIの解釈が困難になるため、どうしても必要な理由があるときのみ使用すること。

Marp

プレゼンテーション資料を作成するツールである。MkDocsと統合してWebで表示し、PDFはMkDocsのto-pdfプラグインで統合的に出力される。

サンプルページ

  • Mermaid - フローチャート、シーケンス図、状態遷移図などのサンプル
  • Draw.io - VS Code拡張を使ったSVG図の作成方法
  • Marp - プレゼンテーション資料の作成方法