🧩 Exercícios: Diagramas de Sequência e Estados com Mermaid
Extra Documentação Técnica com Markdown • Trilha Progressiva em 4 Níveis
🎯 Nível 1: Fundamentos
Problema 6.1 — Fluxo Simples de Requisição e Resposta HTTP em Mermaid
Contexto: Construir um diagrama de sequência simples modelando uma requisição GET de um Navegador para uma API REST e seu banco de dados.
Requisitos de Execução:
- Declarar
sequenceDiagramcomautonumber. - Incluir os participantes:
Navegador,API,Banco. - Modelar o fluxo de busca de dados com resposta pontilhada.
Resultado Esperado
```mermaid
sequenceDiagram
autonumber
Navegador->>API: GET /produtos
API->>Banco: SELECT * FROM produtos
Banco-->>API: Retorna registros
API-->>Navegador: 200 OK (JSON)
```
📤 Instruções de Entrega (Microsoft Teams)
- Salve o arquivo como:
Atividade_06_1_SeuNome.md - Envie na tarefa:
Atividade Cap 06 - Sequência e Estados com Mermaid
🔑 Gabarito de Código & Solução Comentada
```mermaid
sequenceDiagram
autonumber
Navegador->>API: GET /produtos
API->>Banco: SELECT * FROM produtos
Banco-->>API: Retorna registros
API-->>Navegador: 200 OK (JSON)
```
Comentário: A seta ->> denota chamada síncrona com ponta preenchida, enquanto -->> representa a linha tracejada de retorno.
🎯 Nível 2: Prática
Problema 6.2 — Bifurcação Condicional com Bloco alt / else
Modele um fluxo de checkout onde o sistema verifica o limite do cartão: se aprovado (alt Saldo Suficiente), confirma o pedido; senão (else Saldo Insuficiente), retorna erro 402.
🔑 Gabarito de Código & Solução Comentada
```mermaid
sequenceDiagram
actor Cliente
participant Gateway as Gateway de Pagamento
participant Banco as Banco Emissor
Cliente->>Gateway: Solicitar Pagamento (R$ 150)
Gateway->>Banco: Autorizar Transação
alt Saldo Suficiente
Banco-->>Gateway: Transação Aprovada
Gateway-->>Cliente: Pedido Confirmado (200 OK)
else Saldo Insuficiente
Banco-->>Gateway: Transação Recusada
Gateway-->>Cliente: Pagamento Rejeitado (402 Payment Required)
end
```
🎯 Nível 3: Integração
Problema 6.3 — Máquina de Estados de Ciclo de Vida de um Pedido de E-commerce
Construa um diagrama stateDiagram-v2 completo modelando os estados: Criado, AguardandoPagamento, Pago, EmSeparacao, EmTransito, Entregue e Cancelado.
🔑 Gabarito de Código & Solução Comentada
```mermaid
stateDiagram-v2
[*] --> Criado
Criado --> AguardandoPagamento
AguardandoPagamento --> Cancelado: Timeout de 24h
AguardandoPagamento --> Pago: Pix / Cartão Confirmado
Pago --> EmSeparacao: Nota Fiscal Emitida
EmSeparacao --> EmTransito: Coletado pela Transportadora
EmTransito --> Entregue: Comprovante Assinado
Entregue --> [*]
Cancelado --> [*]
```
🎯 Nível 4: Desafio
Problema 6.4 — Validador Sintático de Blocos Mermaid em Python
Implemente um script em Python que verifique se um bloco Mermaid de sequência possui tags de fechamento corretas para blocos loop, alt e par, alertando sobre blocos não encerrados.
🔑 Gabarito de Código & Solução Comentada
# mermaid_syntax_checker.py
def validar_blocos_mermaid(texto_mermaid):
pilha = []
palavras_inicio = ["loop", "alt", "par"]
for num_linha, linha in enumerate(texto_mermaid.strip().split("\n"), 1):
l = linha.strip()
tokens = l.split()
if not tokens:
continue
primeiro = tokens[0]
if primeiro in palavras_inicio:
pilha.append((primeiro, num_linha))
elif primeiro == "end":
if not pilha:
return False, f"Linha {num_linha}: 'end' inesperado sem bloco aberto!"
pilha.pop()
if pilha:
bloco, linha_abertura = pilha[-1]
return False, f"Bloco '{bloco}' aberto na linha {linha_abertura} nunca foi fechado com 'end'!"
return True, "Sintaxe de blocos Mermaid válida!"