Diagrama de Classes Mermaid: Criar Diagramas UML de Classes

Sintaxe de Diagrama de Classes Mermaid

Diagramas de classes mostram a estrutura de um sistema mapeando classes, seus atributos e métodos, e as relações entre elas. São o diagrama UML padrão para documentar designs orientados a objetos, bibliotecas cliente de API e modelos de domínio. Mermaid os renderiza a partir de uma definição textual que se lê como uma versão simplificada do código em si.

Definindo Classes

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

Cada linha dentro do bloco de classe define um membro. O formato é visibilidade nome tipo para campos e visibilidade nome(parâmetros) tipoRetorno para métodos.

Modificadores de Visibilidade

Relacionamentos

Relacionamentos são desenhados entre classes usando sintaxe de seta:

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

Tipos de Relacionamento

Cardinalidade

Adicione rótulos de multiplicidade aos relacionamentos:

    Customer "1" --> "*" Order : places
    Order "1" *-- "1..*" LineItem : contains

Valores comuns de cardinalidade: "1", "0..1", "*", "1..*", "0..*".

Anotações

Marque classes como abstratas, interface, enumeração ou qualquer estereótipo personalizado:

classDiagram
    class Shape {
        <<abstract>>
        +area() double
        +perimeter() double
    }
    class Drawable {
        <<interface>>
        +draw(canvas) void
    }
    class Color {
        <<enumeration>>
        RED
        GREEN
        BLUE
    }

Anotações renderizam em guillemets acima do nome da classe.

Genéricos

Use tiles em vez de colchetes angulares:

classDiagram
    class Repository~T~ {
        +findById(id) T
        +findAll() List~T~
        +save(entity T) T
        +delete(id) void
    }
    class UserRepository {
        +findByEmail(email) User
    }
    Repository~T~ <|-- UserRepository

Repository~T~ renderiza como Repository<T>.

Padrões Práticos

Padrão Repository

classDiagram
    class Repository~T~ {
        <<interface>>
        +findById(id) T
        +save(entity) T
        +delete(id) void
    }
    class UserRepository {
        <<interface>>
        +findByEmail(email) User
    }
    class PostgresUserRepository {
        -DataSource ds
        +findById(id) User
        +findByEmail(email) User
        +save(entity) User
        +delete(id) void
    }
    Repository~T~ <|.. UserRepository
    UserRepository <|.. PostgresUserRepository

Padrão Observer

classDiagram
    class EventEmitter {
        -Map~String, List~Handler~~ listeners
        +on(event, handler) void
        +emit(event, data) void
        +off(event, handler) void
    }
    class Handler {
        <<interface>>
        +handle(data) void
    }
    class LogHandler {
        +handle(data) void
    }
    class MetricsHandler {
        +handle(data) void
    }
    EventEmitter o-- Handler
    Handler <|.. LogHandler
    Handler <|.. MetricsHandler

Para documentar como essas classes interagem em tempo de execução, use o Diagrama de Sequência Mermaid. Para as tabelas de banco de dados por trás do seu modelo de domínio, tente o Diagrama ER Mermaid.