Black Pine

Mermaid Diagrams

Creating diagrams using Mermaid

Mermaid is used to create diagrams and create visualization using text and code.

Diagrams are created with <pre> tag

<pre class="mermaid">
    graph TD
        A --> B
</pre>

Example of sequence diagram is:

sequenceDiagram
    Client->>Server: homepage
    Server-->>Client: response
    Client-)Server: login
 

Example of git branching diagram with custom main branch name:


---
config:
  theme: 'base'
  gitGraph:
    mainBranchName: 'master'
---
gitGraph
   commit id: "prod"
   commit id: "checkout"
   branch develop
   commit
   commit
   checkout master
   commit id: "security"
   commit id: "bugfix"
   checkout develop
   merge master
   commit
   commit
   checkout master
   merge develop
   commit id: "deploy"