Mermaid 다이어그램 그리는 도구

• 홈페이지
  https://mermaid-js.github.io/mermaid/#/

• 온라인 에디터
  https://mermaid.live/

아래와같은 text 기반 문법으로 다이어그램을 그린다.

sequenceDiagram
    participant M as main()
    participant C as co-routine()
    
    activate M
    
    M->>+C: 코루틴 호출
    deactivate M
    M->>M: wait

    C--)-M: 코루틴 suspend
    activate M
    C-)C: wait

    M-)+C: 코루틴 resume
    deactivate M
    M->>M: wait

    C-->>-M: 코루틴 suspend
    
    activate M
    deactivate M

그러면 아래와 같이 표기됨

sequenceDiagram
    participant M as main()
    participant A1 as async1
    participant A2 as async2
    participant A3 as async3

    activate M
    M-)+A1: async1
    M-)+A2: async2
    M-)+A3: async3
    A1-)-M: 1
    A2-)-M: 2
    A3-)-M: 3 & async join

    deactivate M