Mermaid

C'EST QUOI ?

Mermaid est une lib JavaScript qui transforme un texte façon Markdown en diagrammes SVG (flowcharts, diagrammes de séquence, classes, Gantt, ER, états, journey…). Le but : écrire ses schémas dans le code source, les versionner avec Git, et laisser le rendu se faire automatiquement par GitHub, Notion, Obsidian, VS Code et la plupart des outils modernes.

POURQUOI C'EST INTÉRESSANT ?

• Diagrammes en texte brut : Plus de fichiers .drawio binaires impossibles à diff. Une PR qui modifie un schéma se relit comme une PR de code.
• Support natif partout : GitHub, GitLab, Notion, Obsidian, Azure DevOps, VS Code, Jetbrains… le rendu est intégré côté plateforme, pas besoin de pipeline.
• Catalogue large : Flowcharts, séquence, classes, ER, état, Gantt, pie, git graph, journey, C4, mindmap, timeline, sankey, quadrant chart… La plupart des besoins de doc technique sont couverts.
• Live editor : mermaid.live permet d'itérer rapidement sur un diagramme en mode prévisualisation, puis de copier-coller le code dans la doc.
• Embarquable : Disponible en npm, en CDN, en CLI (rendu PNG/SVG) et via une API. S'intègre dans n'importe quel générateur de doc, blog ou app web.

CAS D'USAGE

• Schémas d'architecture dans un README, versionnés avec le code
• Diagrammes de séquence pour documenter un flow d'API ou d'auth
• Roadmap projet en Gantt directement dans la doc, sans Excel ni outil externe
• Modèle de données (ER) à côté des migrations dans le repo
• Schémas de workflow CI/CD ou de logique métier dans la doc interne