Table des matières

Schema example
- Layer schema
- Network diagram

D2 allows you to create schemas via a text file, such as the ancestor Graphviz or Mermaid. I like it because I find it simple, and it makes fairly clean diagrams.

Schema example

Layer schema

grid-rows: 6
grid-gap: 20
style.fill: black

NixOS: {
  width: 400
  style.fill: "#5277C3"
  style.stroke: "#7c9ee8"
  style.font-color: white
}

Firewall: {
  width: 400
  style.fill: "#DC143C"
  style.stroke: "#ff4757"
  style.font-color: white
}

Kernel: {
  style.fill: "#E74C3C"
  style.stroke: "#ec7063"
  style.font-color: white
}

SSH: {
  style.fill: "#2C3E50"
  style.stroke: "#34495E"
  style.font-color: white
}

Nginx: {
  style.fill: "#009639"
  style.stroke: "#00b347"
  style.font-color: white
}

"Journald & Files": {
  width: 400
  style.fill: "#6C757D"
  style.stroke: "#95a5a6"
  style.font-color: white
}

Vector: {
  width: 400
  style.fill: "#FF6B35"
  style.stroke: "#ff8c61"
  style.font-color: white
}

Reaction: {
  style.fill: "#9B59B6"
  style.stroke: "#b37fd6"
  style.font-color: white
}

VictoriaMetrics: {
  style.fill: "#F39C12"
  style.stroke: "#f5b041"
  style.font-color: white
}

Network diagram

direction: right
vars: {
  d2-config: {
    layout-engine: elk
  }
}
style.fill: "#222222"

title: homelab network {
  shape: text
  near: top-center
  style: {
    font-size: 55
  }
}

internet: internet
internet.shape: cloud
box: SFR Box\n
internet -- box: {style.stroke: red}

# vlan-adm

mikrotik254: {
  eth01
  eth02
  eth03
  eth04
}

mikrotik253: {
  eth02
  eth03
  eth04
  eth05
  eth09
  eth10
}

mikrotik252: {
  eth02
  eth03
  eth04
  eth05
}

# Mikrotik254
box -- mikrotik254.eth01 -- mikrotik254.bridge: {style.stroke: red}
mikrotik254.bridge -- mikrotik254.eth02: tagged VLAN WAR(2) {style.stroke: red}
mikrotik254.bridge -- mikrotik254.eth02: tagged VLAN DMZ(32) {style.stroke: orange}
mikrotik254.bridge -- mikrotik254.eth02: tagged VLAN ADM(240) {style.stroke: purple}
mikrotik254.bridge -- mikrotik254.eth02: tagged VLAN LAN(254) {style.stroke: green}

mikrotik254.bridge -- mikrotik254.eth03: tagged VLAN WAR(2) {style.stroke: red}
mikrotik254.bridge -- mikrotik254.eth03: tagged VLAN DMZ(32) {style.stroke: orange}
mikrotik254.bridge -- mikrotik254.eth03: tagged VLAN ADM(240) {style.stroke: purple}
mikrotik254.bridge -- mikrotik254.eth03: tagged VLAN LAN(254) {style.stroke: green}

mikrotik254.bridge -- mikrotik254.eth04: LAN {style.stroke: green}
mikrotik254.bridge -- mikrotik254.eth10: ADM {style.stroke: purple}
mikrotik254.eth02 -- mikrotik253.eth02: Trunk: {
  style.stroke-width: 8
  style.font-color: white
}

mikrotik254.eth03 -- mikrotik252.eth02: Trunk: {
  style.stroke-width: 8
  style.font-color: white
}

mikrotik254.eth04 -- android tv: LAN {
  style.stroke: green
  style.font-color: white
}

# mikrotik253
mikrotik253.eth02 -- mikrotik253.router: Trunk: {style.stroke-width: 8}
mikrotik253.router -- mikrotik253.eth03: LAN {style.stroke: green}
mikrotik253.router -- mikrotik253.eth05: LAN {style.stroke: green}

mikrotik253.router -- mikrotik253.eth09: tagged VLAN DMZ(32) {style.stroke: orange}
mikrotik253.router -- mikrotik253.eth09: tagged VLAN ADM(240) {style.stroke: purple}
mikrotik253.router -- mikrotik253.eth10: ADM {style.stroke: purple}
mikrotik253.eth03 -- laptop: LAN {
  style.stroke: green
  style.font-color: white
}

mikrotik253.eth05 -- philips hue: LAN {
  style.stroke: green
  style.font-color: white
}

mikrotik253.eth09 -- hype10: Trunk: {
  style.stroke-width: 8
  style.font-color: white
}

# mikrotik252
mikrotik252.eth02 -- mikrotik252.router: Trunk: {style.stroke-width: 8}
mikrotik252.router -- mikrotik252.eth03: LAN {style.stroke: green}
mikrotik252.router -- mikrotik252.eth04: LAN {style.stroke: green}
mikrotik252.router -- mikrotik252.eth05: LAN {style.stroke: green}