Notions de base de la syntaxe D2

D2 est un outil moderne basé sur le texte pour créer des diagrammes clairs et lisibles. Il signifie « Diagrammation déclarative ». Dans VPasCode, D2 permet aux développeurs logiciels et aux architectes de solutions de transformer du texte de code simple en modèles visuels propres sans avoir à dessiner manuellement des formes.

1. Formes de base et connexions

Pour créer des formes, tapez simplement leurs noms. Pour relier des formes, utilisez une flèche (-> pour une seule direction ou <-> pour deux directions).

# Connexion simple
Utilisateur -> Serveur Web : Demande HTTP
Serveur Web -> Base de données : Récupérer les données
Base de données -> Serveur Web : Retourner les résultats
Serveur Web <-> Cache : Synchronisation lecture/écriture

2. Types de formes et étiquettes personnalisées

Par défaut, les formes apparaissent sous forme de boîtes standard. Vous pouvez facilement changer le type d’icône d’une forme ou définir une étiquette personnalisée en utilisant la propriété shape propriété.

# Définition des types de formes
Client : {
  shape : person
}

Services Cloud : {
  shape : cloud
}

Base de données principale : {
  shape : cylinder
  label : "Base de données principale (PostgreSQL)"
}

Client -> Services Cloud -> Base de données principale

3. Définitions de classes

D2 prend nativement en charge la conception de structures orientées objet en utilisant la forme class shape.

CompteClient : {
  shape : class

  accountId : String
  emailAddress : String

  isActive() : Boolean
}

4. Conteneurs imbriqués (regroupement)

D2 permet de regrouper facilement des éléments à l’intérieur de conteneurs en utilisant des accolades standard (“{}). Vous pouvez également relier des éléments entre différents groupes en utilisant la notation pointée.

# Regroupement avec des conteneurs
Application Frontend : {
  Interface React -> Gestionnaire d'état
}

Infrastructure Backend : {
  Passerelle API -> Microservice d'authentification
  Passerelle API -> Microservice de commande
}

# Connexion entre groupes
Application Frontend.Gestionnaire d'état -> Infrastructure Backend.Passerelle API : Appel REST

5. Style et couleurs

Les couleurs d’arrière-plan personnalisées, les couleurs de trait et les styles de police peuvent être personnalisés directement dans le bloc en utilisant le mot-cléstylemot-clé.

Service A : {
  style : {
    remplissage : "#e0e7ff"
    trait : "#4338ca"
    rayon-de-bord : 8
  }
}

Service B : {
  style : {
    remplissage : "#fef3c7"
    trait : "#d97706"
  }
}

Service A -> Service B : Envoyer un message

6. Feuille de mémoire de syntaxe rapide