Diagramas con Mermaid en Markdown

Mermaid es una herramienta que permite crear diagramas y gráficos directamente en Markdown usando una sintaxis basada en texto. Es compatible con plataformas como GitHub, GitLab, Obsidian y muchas más.

Cómo usar Mermaid

Para crear un diagrama con Mermaid, se usa un bloque de código con el lenguaje mermaid:

```mermaid
graph TD
    A[Inicio] --> B[Proceso]
    B --> C[Fin]
```

Tipos de diagramas

Diagrama de flujo

```mermaid
graph TD
    A[Inicio] --> B{¿Condición?}
    B -->|Sí| C[Acción 1]
    B -->|No| D[Acción 2]
    C --> E[Fin]
    D --> E
```

Diagrama de secuencia

```mermaid
sequenceDiagram
    Usuario->>Servidor: Petición HTTP
    Servidor->>Base de datos: Consulta
    Base de datos-->>Servidor: Resultado
    Servidor-->>Usuario: Respuesta
```

Diagrama de Gantt

```mermaid
gantt
    title Planificación del proyecto
    dateFormat  YYYY-MM-DD
    section Diseño
    Wireframes     :a1, 2024-01-01, 7d
    Mockups        :after a1, 5d
    section Desarrollo
    Frontend       :2024-01-15, 14d
    Backend        :2024-01-15, 14d
```

Diagrama de clases

```mermaid
classDiagram
    Animal <|-- Perro
    Animal <|-- Gato
    Animal : +String nombre
    Animal : +comer()
    Perro : +ladrar()
    Gato : +maullar()
```

Plataformas compatibles

Estas son las principales plataformas que soportan Mermaid:

GitHub: Soporta Mermaid de forma nativa en archivos Markdown.
GitLab: Soporta Mermaid en archivos Markdown y wikis.
Obsidian: Soporta Mermaid de forma nativa.
Notion: Soporta bloques de código Mermaid.
HackMD: Soporta Mermaid de forma nativa.