Ein Kanban-Board ist ein visuelles Werkzeug zur Arbeitsablauf-Steuerung, das verwendet wird, um Aufgaben oder Arbeitsaufträge über verschiedene Verarbeitungsstufen (wie Backlog, In Bearbeitung und Abgeschlossen) zu verfolgen. Als integrierte Funktion in Mermaid.js eingeführt, ermöglicht dieser textbasierte Ansatz Entwicklerteams und Projektmanagern, schnell interaktive Aufgaben-Dashboards innerhalb von Dokumentationsdateien zu erstellen, ohne manuelle Verfolgungs-Apps oder Drittanbieter-Bildelemente verwalten zu müssen.
Grundlegende Syntaxstruktur
Jedes Kanban-Board beginnt mit dem kanban Deklarationskopf. Spalten werden mit dem section Schlüsselwort definiert, und einzelne Aufgabenkarten werden unter jeder Spalte sequenziell aufgelistet, indem Einrückungsplatzhalter verwendet werden.
kanban
title "Beispielprojekt-Sprint"
section Todo
Datenbank-Schema entwerfen
API-Routen entwerfen
section In Bearbeitung
Auth-Middleware implementieren
Syntax-Referenz
Die folgende Tabelle zerlegt die grundlegenden Datenkomponenten und Parameter, die zur Erstellung einer Kanban-Board-Karte in Mermaid.js verwendet werden.
| Syntax-Komponente | Typ-Anforderung | Beschreibung & Verwendungsregeln |
|---|---|---|
| Deklaration | Schlüsselwort-Bezeichner | Initialisiert die Parameter für die agile Arbeitsablauf-Block-Zuordnung. Muss genau das kanban Block verwenden. |
| Titel | Angeführter String | Ein optionaler globaler Arbeitsbereichstitel, der zentral am oberen Rand des Kanban-Canvas platziert ist. |
| Abschnittsspalte | Schlüsselwort + Name | Definiert eine unabhängige Spalte für einen Arbeitsablaufstadium. Verwenden Sie das section Schlüsselwort gefolgt von der Beschriftung der Spalte. |
| Standard-Aufgabenkarte | Eingerückter String | Eine reine Textbeschreibung, die eine einzelne Karte darstellt. Sie muss direkt unter ihrem aktiven Abschnitt eingerückt oder eingerückt sein. |
| Aufgaben-ID-Karte | Eckige Kennung | Ein erweitertes Format zur Aufgabenkartenverfolgung, das einen expliziten eindeutigen ID-Token zusammen mit seinem Anzeigetext verwendet: id[Card-Text]. |
| Metadatenblock | JSON-Konfigurationskarte | Ein optionaler Eigenschaftenblock, der mit der @{...} Syntaxregel angehängt wird, um Attribute wie Ticketpriorität oder Besitzer zuzuweisen. |
Erweiterte Aufgabenattribute & Metadaten
Für detaillierte Engineering-Sprints oder Fehlerverfolgungsabläufe können Sie Metadatenattribute direkt auf eine Karte setzen. Indem Sie eine eindeutige Knoten-ID (wie task1[...]) mit einem abschließenden JSON-Konfigurationsdeklarationsblock (@{}), können Sie strukturierte Variablen wie Aufgabenzuweisungen, Prioritäten und interne Tracking-Tickets direkt auf der Vorderseite des Kartelements ausgeben.
Unterstützte Aufgabenvariablen
| Attributschlüssel | Wertformatierung | Visueller Ergebnis |
|---|---|---|
zugeordnet |
Zitiertes Zeichenfolgenname | Rendert die zugewiesene Besitzer- oder Entwicklerbezeichnung direkt innerhalb der Karten-Detailmatrix. |
Priorität |
Zitierte Skalenzeichenfolge | Zeigt Benchmarkwerte für die Aufgabenschwere (z. B. 'Hoch', 'Mittel', 'Niedrig'). |
Ticket |
Ganzzahliger oder alphabetischer Token | Verfolgt verknüpfte Entwicklungs-Aufgabennummern oder Systemprojekt-Codes. |
Realitätsnahe Vorlage: Agile Entwicklung Freigabe-Sprint
Diese umfassende Vorlage verfolgt eine Infrastruktur-Bereitstellungsfreigabe. Sie legt drei verschiedene Spalten (Backlog, In Bearbeitung und Bereit zur Bereitstellung) fest und nutzt erweiterte Aufgaben-IDs in Kombination mit strukturellen Metadaten-Parametern, um spezifische Entwickler und Ticket-Codes über Features hinweg zuzuweisen.
kanban
titel "Q3 Kernfunktions-Freigabetafel"
abschnitt Backlog
task101[API-Endpunkt-Dokumentation erstellen]@{ zugeordnet: 'Sarah K', Priorität: 'Mittel' }
task102[Entwurf der Wireframes für die Landing Page]
abschnitt In Bearbeitung
task201[Datenbank-Abfrage-Synchronisation verfeinern]@{ zugeordnet: 'Alex M', Priorität: 'Hoch', Ticket: 4012 }
task202[Lightbox-UI-Komponenten konfigurieren]@{ zugeordnet: 'Sarah K', Priorität: 'Niedrig' }
abschnitt Bereit zur Bereitstellung
task301[Mehrfaktor-Authentifizierung für Benutzer implementieren]@{ zugeordnet: 'Dev-Team', Ticket: 3985 }
Syntax-Tipp: Während einfache Aufgaben als unzitierte Textzeilen eingegeben werden können, müssen komplexe Zuweisungen, die Metadatenparameter enthalten, *unbedingt* einen eindeutigen ID-Zuordnungs-String-Präfix verwenden (wie z. B. id1[...]@{...}). Die Wiederverwendung derselben Aufgaben-ID an verschiedenen Stellen der Tafel überschreibt Eigenschaften oder löst Layout-Fehler aus.
Häufige Syntax-Fehler & Systembeschränkungen
Bei der Entwicklung hochdichter, mehrstufiger Layout-Systeme sollten diese strukturellen Fehlerbehebungsparameter berücksichtigt werden:
- Die Regel: Abschnitt vor Karten: Alle Aufgabenkarten müssen unter einem aktiven Spaltenblock liegen. Das Schreiben einer Aufgaben-Zeile direkt unter Ihrem Haupt-
kanbanTitel, ohne zuerst einenabschnittSpaltenkopf zu deklarieren, stoppt die Kompilierung. - Leerzeichen und Einrückung: Der Verfolgungs-Layout-Engine gruppiert Karten basierend auf Zeilen-Einrückung. Stellen Sie sicher, dass alle Aufgabenkarten-Zeilen einheitlich unter ihren aktiven
abschnittTags eingerückt sind, um Ausrichtungsfehler zu vermeiden. - Metadaten-Trennzeichen-Format: Beim Erstellen benutzerdefinierter Attribute innerhalb eines
@{ }Block müssen Schlüssel und Werte gültigen Systemargumenten entsprechen. Trennen Sie mehrere Attribute durch Kommas und verwenden Sie saubere Anführungszeichen um Ihre Zeichenkettenzuweisungen. - Verwaltung der Karten-Dichte: Obwohl das Kanban-Element vollständig reaktionsfähig ist, kann die Überfüllung einer einzelnen Tafel mit mehr als 5 Spalten oder das Hinzufügen von Dutzenden dichter Metadatenzeilen die Scannbarkeit auf mobilen Geräten verringern. Passen Sie Ihre Layout-Abstandseinstellungen bewusst an.