facebook twitter hatena line email

「VisualStudioCode/Mermaid」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(サンプル)
(シーケンス図サンプル)
 
(同じ利用者による、間の2版が非表示)
行73: 行73:
  
 
==シーケンス図サンプル==
 
==シーケンス図サンプル==
 +
sequence.md
 +
<pre>
 
```mermaid
 
```mermaid
 
sequenceDiagram
 
sequenceDiagram
     コック ->> フライパン: ハンバーグを焼く
+
     UNITY_User ->> PHP_User/list : request
     フライパン -->> コック : 焼き上がり
+
     PHP_User/list -->> UNITY_User : response
 
```
 
```
 +
</pre>

2024年11月2日 (土) 05:28時点における最新版

Mermaidとは

  • クラス図やシーケンス図やフローチャートなどが描ける。
  • vscode、github、notionでも表示ができる

インストール

https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid

プレビュー

VisualStudioCodeを、開いて、コードを入力して、右上の虫眼鏡をクリックすると、プレビューできる。

"このフォルダを信頼する"というリンクをクリック

クラス図サンプル

クラス図

class.md

```mermaid
classDiagram
    class User{
        +Int id
        +String name
        +name()
    }
```

関連クラス

relation.md

```mermaid
classDiagram

    class User{
        +Int id
        +String name
        +name()
    }

    User --|> BaseUser
    Car --|> BaseCar: 継承
```

access.md

```mermaid
classDiagram
    class User{
        +String Public
        -String Private
        #String Protected
        ~String Packaged
```

その他関連

```mermaid
classDiagram
    A --* B: コンポジット
    C --o D: 集約
    E --> F: 汎化
    G -- H: 関連(実線)
    I ..> J: 依存
    K ..|> L: 実現
    M .. N: 関連(点線)
    O --|> P: 継承
```

参考:https://qiita.com/hirokiwa/items/1a490c75961efd1e1487

参考:https://note.com/_kikiyo_/n/n67ca638d8c5c

シーケンス図サンプル

sequence.md

```mermaid
sequenceDiagram
    UNITY_User ->> PHP_User/list : request
    PHP_User/list -->> UNITY_User : response
```