Mermaid Diagramsβš‘

Aboutβš‘

Mermaid lets you create diagrams and visualizations using text and code.

It is a Javascript based diagramming and charting tool that renders Markdown-inspired text definitions to create and modify diagrams dynamically.

If you are familiar with Markdown you should have no problem learning Mermaid's Syntax.

Live-Editor Tutorialsβš‘

The definitions that can be generated the Live-Editor are also backwards-compatible as of version 8.7.0.

Chris Chinchilla: Hands on - Text-based diagrams with Mermaid

GitLab Unfiltered: How to Create Mermaid Diagrams

GitLab Unfiltered: Emilie adds a mermaid diagram to the handbook

World of Zero: I Learn How To Build Flowcharts and Signal Diagram's in Mermaid.JS

Eddie Jaoude: Can you code your diagrams?

Tools #Development/Toolsβš‘

- Mermaid Online Live Editorβš‘


Links: 020 - Development | Javascript | Markdown

Sources: - 🌐 CDN | πŸ“– Documentation | πŸ™Œ Contribution | πŸ“œ Changelog - mermaid - Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs. (mermaid-js.github.io) - Syntax and Configuration (mermaid-js.github.io) - Mermaid's Syntax - Overview for Beginners (mermaid-js.github.io) - mermaid-js (github.com) | mermaid-js/mermaid (github.com) | mermaid-js/mermaid-cli (github.com) - Mermaid Online Live Editor