dorfteich/docs/de/tutorial/19-standard-bausteine.md
Claude Fable 5 93cbe6499d
All checks were successful
CD / Build and push images (push) Successful in 1m10s
CD / Deploy to Test (push) Successful in 10s
CD / Smoke tests against Test (push) Successful in 1m14s
CD / Promote to Int (push) Successful in 11s
CI / Lint, typecheck, test (push) Successful in 4m29s
CI / Build container images (push) Has been skipped
CI / Auth e2e pack (push) Successful in 6m34s
CI / Import/export fidelity gate (push) Successful in 53s
docs(tutorial): add 20 screenshots (taken as Nadia on prod), wire them into the chapters
Before/after pair for chapter 4 via temporary version rollback; the two
remaining placeholders (notification inbox, live cursors) need a second
account and are deferred.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0155v2aT8AG1kZDQEZiCLBWC
2026-07-18 14:56:52 +02:00

3.2 KiB

Die Standard-Bausteine im Schaufenster

Dorfteich bringt fünf Plugins mit. Dieses Kapitel ist ein Schaufensterbummel: je ein Blick, wofür jeder Baustein gut ist — ohne Bedienungsanleitung. (Die beiden Diagramm-Bausteine haben eigene kleine Welten; hier geht es nur darum, dass du weißt, was es gibt.)

Mermaid-Diagramm — Diagramme aus Text

Ein Block für die Seitenmitte: Du beschreibst in Textform, was zusammenhängt („A führt zu B, B führt zu C") — der Baustein zeichnet daraus ein sauberes Diagramm: Ablaufpläne, Zeitleisten, Organigramme. Ideal, wenn das Diagramm mit dem Inhalt mitwachsen soll: Text ändern, Zeichnung folgt.

In Nadias Teich zeichnet ein Mermaid-Block den Wochenplan auf ihrer Seite Marathon-Training.

Der Mermaid-Trainingsplan auf Nadias Marathon-Seite

draw.io-Diagramm — frei zeichnen

Das Gegenstück für alle, die lieber zeichnen statt beschreiben: Ein vollwertiges Zeichenprogramm öffnet sich im Vollbild — Kästen, Pfeile, Formen, alles frei platzierbar. Gut für Skizzen, Lagepläne, Schaubilder. Beim Schließen landet die Zeichnung als Bild in der Seite; zum Weiterzeichnen öffnest du sie einfach wieder.

Nadia hat damit die Route ihrer liebsten Schotterrunde auf der Seite Gravel skizziert.

Nadias Routen-Skizze aus dem draw.io-Baustein

Inhaltsverzeichnis — lange Seiten gliedern

Ein Seiten-Werkzeug: Es sitzt hinter dem Werkzeug-Symbol in der Kopfleiste, liest die Überschriften der geöffneten Seite und zeigt ein klickbares Inhaltsverzeichnis — ohne dass du irgendetwas in den Text einbauen musst. Schreibst du einen neuen Abschnitt, ist er beim nächsten Öffnen einfach da. Probier es auf Nadias Seite Konzert-Notizen, die mit ihren Zwischenüberschriften genau dafür gebaut ist.

Das Inhaltsverzeichnis als Seiten-Werkzeug auf den Konzert-Notizen

Seitenindex — den Teich auflisten

Das zweite Seiten-Werkzeug: eine automatisch aktuelle Liste der Seiten des Teichs, nach Wunsch nach Label gefiltert. Praktisch, wenn die Sammlung groß wird und du eine lebende Übersicht willst, die niemand von Hand pflegen muss.

Abschnitts-Stile — Kästen mit Charakter

Eine kleine Familie von Gestaltungen für die Werkzeugleiste: Info-Kasten, Warnung, Hervorhebung, Farbige Box. Damit hebst du im Bearbeitungsmodus ganze Absätze vom Beiläufigen ab — der Hinweis, der nicht überlesen werden soll, bekommt einen farbigen Rahmen.

Probier es aus

Such dir einen Baustein aus diesem Schaufenster aus — für den Anfang empfehlen sich das Inhaltsverzeichnis (öffne es über das Werkzeug-Symbol auf deiner längsten Seite) oder ein Info-Kasten aus den Abschnitts-Stilen. Mehr als einen brauchst du heute nicht; die anderen laufen dir wieder über den Weg, wenn du sie brauchst.


Weiter: Kapitel 20 — Dein Profil und deine Einstellungen · Zum Überblick