collapse

* Posts Recentes

Cerca eléctrica por SerraCabo
[14 de Junho de 2025, 23:26]


Alguém arranja motores? por almamater
[10 de Junho de 2025, 22:34]


Condensador 4.7uF 0603 por brunus
[09 de Junho de 2025, 15:52]


+ LASERs por dropes
[30 de Maio de 2025, 23:11]


Lenovo IdeaPad 3 Não liga por jm_araujo
[07 de Maio de 2025, 19:10]


Identificar Diodo Zenner por filjoa
[01 de Maio de 2025, 23:07]


Meu novo robô por dropes
[18 de Março de 2025, 14:51]


JBL partybox On-The-Go por almamater
[21 de Fevereiro de 2025, 23:32]


Talking Reverse Engineering with an Absolute Legend! por SerraCabo
[13 de Fevereiro de 2025, 09:56]


Motoserra Stihl 120C por brunus
[11 de Fevereiro de 2025, 16:29]

Autor Tópico: Mermaid – UML, Entity Relationship e outros diagrams in MarkDown.  (Lida 5061 vezes)

0 Membros e 1 Visitante estão a ver este tópico.

Offline blabla

  • Mini Robot
  • *
  • Mensagens: 258
Boa noite a todos,

hoje gostava de vos falar de um standard e o programa Mermaid para descrever-se textualmente diagramas de UML,  de Entity Relationship e outros em MarkDown e que depois os renderiza de forma muito apelativa.

1. Flowcharts
2. Sequence diagrams
3. Class Diagram
4. State Diagram
5. Entity Relationship Diagram
6. User Journey
7. Gantt
8. Pie Chart
9. Requirement Diagram

Vejam aqui exemplos dos diagramas finais e da sintaxe.

Mermaid
https://mermaid-js.github.io/mermaid/

O Zettlr – Sistema de notas e editor de Markdown, suporta nas suas notas a inclusão de Markdown Mermaid.

Ex.

Código: [Seleccione]
```mermaid

flowchart
    A --> B

```


E faz o rendering automático dos diagramas do Mermaid nas notas quando se está no editor de notas e no PDF ou outro formato final.

O VScode também suporta nos ficheiros MarkDown um plugin que faz o rendering dos diagramas no Preview do ficheiro de MarkDown.

Vejam o vídeo seguinte de como é simples usar o Mermaid no vosso Markdown.

Video - Mermaid JS - Finally There’s A Great UML and Diagram Drawing Tool


Obrigado,

Cumprimentos,
João