Mermaid para Iniciantes: De Zero a Herói dos Diagramas em 10 Minutos

Ok, vou te contar um pequeno segredo.

Aqueles diagramas elegantes que você vê em documentação técnica? Os fluxogramas em apresentações? Os diagramas de arquitetura que fazem engenheiros parecerem ter tudo sob controle?

São apenas texto. Sério.

O que é Mermaid?

Mermaid é uma forma de criar diagramas usando comandos de texto simples. Em vez de arrastar caixas no PowerPoint (doloroso), você escreve algo assim:

flowchart LR
    A[Início] --> B[Fazer Algo]
    B --> C[Pronto!]

E boom — você tem um fluxograma lindo. Mágica.

Seu primeiro diagrama em 60 segundos

Vamos criar um fluxo de processo simples. Abra o MermaidSnap e cole isto:

flowchart TD
    Acordar[Acordar] --> Cafe[Fazer Café]
    Cafe --> Trabalho[Começar a Trabalhar]
    Trabalho --> Almoco[Almoço]
    Almoco --> Trabalho2[Voltar ao Trabalho]
    Trabalho2 --> Fim[Ir para Casa]

É isso. Você acabou de fazer um diagrama. Percebeu como o código é legível? TD significa "de cima para baixo" — o diagrama flui verticalmente.

Os blocos básicos

Todo diagrama Mermaid tem duas partes:

1. Nós — as caixas (A, B, C, etc.)
2. Conexões — as setas entre eles (-->)

Diferentes colchetes criam diferentes formas:

• [texto] — retângulo
• (texto) — retângulo arredondado
• (chaves ao redor do texto) — diamante (para decisões)
• ((texto)) — círculo

Experimente você mesmo

A melhor forma de aprender é experimentar. Vá ao MermaidSnap, escolha um modelo e comece a mudar coisas. Quebre. Conserte. É assim que você aprende.

Bem-vindo ao mundo dos diagramas. Você vai adorar.