Adding Mermaid To RIMdev.io
A picture is worth a thousand words, so I assume a diagram is worth a billion words. Expressing our ideas is important and our blog is an outlet to not only share with our teammates, but the broader community of readers. Mermaid is a simple markdown based diagramming language with a compelling result.
Placing the following html in our posts…
<div class="mermaid">
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
</div>
results in the wonderful diagram below.
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
Additionally, I can create diagrams like this.
sequenceDiagram
participant Alice
participant Bob
Alice->John: Hello John, how are you?
loop Healthcheck
John->John: Fight against hypochondria
end
Note right of John: Rational thoughts prevail...
John-->Alice: Great!
John->Bob: How about you?
Bob-->John: Jolly good!