Diagrama de Clases Mermaid: Crear Diagramas UML de Clases

Sintaxis de Diagrama de Clases Mermaid

Los diagramas de clases muestran la estructura de un sistema mapeando clases, sus atributos y métodos, y las relaciones entre ellas. Es el diagrama UML estándar para documentar diseños orientados a objetos, bibliotecas cliente de API y modelos de dominio. Mermaid los procesa a partir de una descripción textual que se lee como una versión simplificada del código mismo.

Definiendo Clases

classDiagram
    class UserService {
        -UserRepository repo
        -Logger logger
        +getUser(id) User
        +createUser(data) User
        +deleteUser(id) void
        -validate(data) bool
    }

Cada línea dentro del bloque de clase define un miembro. El formato es visibilidad nombre tipo para campos y visibilidad nombre(parámetros) tipoRetorno para métodos.

Relaciones

Las relaciones se dibujan entre clases usando sintaxis de flecha:

classDiagram
    Animal <|-- Dog : extends
    Animal <|-- Cat : extends
    Dog *-- Leg : has
    Owner o-- Pet : owns
    Kennel --> Dog : houses
    Animal ..> Food : depends on

Tipos de Relación

Anotaciones

Marca clases como abstractas, interfaces, enumeraciones o cualquier estereotipo personalizado:

classDiagram
    class Shape {
        <<abstract>>
        +área() double
        +perimeter() double
    }
    class Drawable {
        <<interface>>
        +draw(canvas) void
    }

Genericos

Usa tilde en lugar de angulares:

classDiagram
    class Repository~T~ {
        +findById(id) T
        +save(entity T) T
    }

Para documentar como estas clases interactuan en tiempo de ejecución, usa la herramienta Diagrama de Secuencia Mermaid.