Mermaid
フローチャート、シーケンス図、ガントチャートなどを書ける作図記法です
https://mermaid.js.org/
Cosenseでは、コードブロックにmermaidが使えます
code:mmdもしくはcode:mermaid、code:ファイル名.mmdで書く
Flowcharts Syntax | Mermaid
code:mermaid
flowchart LR
A-- hello -->B
Gantt diagrams | Mermaid
code:gantt.mmd
gantt
title A Gantt Diagram
dateFormat YYYY-MM-DD
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1, 20d
section Another
Task in Another :2014-01-12, 12d
another task :24d
HSTSの動作をシーケンス図で
code:HSTS.mmd
sequenceDiagram
participant B as Web Browser
participant S as Web Server
B->>S: HTTP Request
S->>B: HTTP Response with HSTS header
Note over B: Browser recognizes HSTS header and updates its internal HSTS list
B->>S: HTTPS Request
S->>B: HTTPS Response with HTML
以下のUserScriptを参考にしました
株式会社はてな様
ScrapboxでMermaidを使う - cockscomblog?
株式会社豆蔵様
ScrapboxでMermaid記法を可視化するUserScriptを作った話 | 豆蔵デベロッパーサイト
ありがとうございましたshokai.icon