🎓 Learning Track: Digital Garden mit Quartz

Lernpfad-Status

Level: 🌱 Beginner → 🌳 Confident Gardener Geschätzter Aufwand: ~15 Stunden Status: 🔄 Aktiv

---

🗺️ Skill-Map: Wo führt dieser Pfad hin?

graph LR
    START([🌱 Null-Kenntnisse]) --> A
    A[Markdown Basics] --> GARDEN([🌳 Eigener Garten live])

    style START fill:#f8f9fa,stroke:#dee2e6
    style GARDEN fill:#d4edda,stroke:#28a745,color:#155724

---

🔗 Prereq-Graph: Was baut auf was auf?

graph TD
    A[📝 Markdown Basics] --> B[🔗 Wikilinks]
    A --> C[⚙️ Frontmatter / YAML]
    B --> D[↩️ Backlinks verstehen]
    C --> D
    C --> E[🏷️ Tags & Hierarchie]
    D --> F[🕸️ Knowledge Graph lesen]
    E --> F
    B --> G[📎 Embeds & Transclusion]
    F --> H[🗺️ MOC-Strategie]
    G --> H
    H --> I[🌿 Eigene Notizen schreiben]
    I --> J[🚀 Deployment: Quartz Build]
    J --> K[🌳 Digital Garden live!]

    style K fill:#d4edda,stroke:#28a745
    style A fill:#fff3cd,stroke:#ffc107

---

📋 Voraussetzungen

Was du vorher brauchst

• Texteditor oder Obsidian installiert
• Node.js 22+ für Quartz
• Git-Grundkenntnisse (clone, commit, push)
• Keine Programmier-Kenntnisse nötig!

---

📚 Phase 1: Fundament (2–3 Stunden)

Ziel: Markdown sicher schreiben, Frontmatter verstehen

Konzepte

• Markdown Basics — Überschriften, Listen, Links, Codeblöcke
  • Ressource: Markdown Guide
  • Notiz: 01-atomic-note (schreibe deine erste Atomic Note!)
• Frontmatter / YAML — title, tags, aliases, description
  • Ressource: frontmatter-guide (kommt)
  • Übung: Frontmatter in 3 eigene Notizen einbauen
• Tags — Hierarchische Tags (topic/subtopic, garden/status)
  • Übung: Tag-System für 5 Notizen anlegen

Meilenstein ✅

Ich kann eine Markdown-Notiz mit vollständigem Frontmatter schreiben.

---

🔗 Phase 2: Verlinkung (3–4 Stunden)

Ziel: Notizen bidirektional vernetzen

Konzepte

• Wikilinks — [[Note]], [[Note|Text]], [[Note#sektion|Sektion]]
  • Ressource: 01-atomic-note (Linking-Tabelle)
  • Übung: 5 Notizen mit je 3 Links erstellen
• Backlinks verstehen — Warum entstehen sie automatisch?
  • Ressource: wikilinks-und-backlinks (kommt)
  • Übung: Backlink-Seite einer Notiz inspizieren
• Embeds — ![[Note]], ![[image.png|300x200]]
  • Übung: Eine Notiz in einer anderen einbetten
• Block-IDs — ^block-id für granulare Referenzen
  • Übung: Block-ID erstellen und referenzieren

Meilenstein ✅

Mein Notiznetz hat 10+ Notizen, alle bidirektional verlinkt. Der Graph zeigt Verbindungen.

---

🗺️ Phase 3: Struktur (3–4 Stunden)

Ziel: Übersicht behalten mit MOCs

Konzepte

• Atomic Notes — Eine Idee, eine Notiz
  • Ressource: 01-atomic-note
  • Übung: 10 Atome zu einem Thema schreiben
• MOC-Strategie — Übersichten bauen
  • Ressource: 02-moc
  • Übung: Erste eigene MOC für dein Hauptthema
• Reifegrade — #garden/seedling → evergreen
  • Übung: Alle Notizen taggen, 3 auf Evergreen bringen
• Ordner-Struktur — Flat vs. hierarchisch
  • Ressource: content/daily/, content/research/

Meilenstein ✅

Ich habe eine MOC, die mein wichtigstes Thema strukturiert.

---

🎨 Phase 4: Quartz & Deployment (3–4 Stunden)

Ziel: Garden live auf einer Website

Konzepte

• Quartz installieren — npm install, npx quartz create
  • Ressource: Quartz + offizielle Docs
  • Übung: Lokaler Build mit npx quartz build --serve
• quartz.config.ts — Basis-Konfiguration anpassen
  • pageTitle, baseUrl, locale: "de-DE"
• Layout anpassen — quartz.layout.ts
  • Übung: RecentNotes() zur Sidebar hinzufügen
• Deployment — Cloudflare Pages / GitHub Pages
  • Ressource: ADR-001-Quartz-als-SSG
  • Übung: Garden deployen und URL teilen

Meilenstein ✅

Mein Garden ist live unter einer öffentlichen URL.

---

🌳 Phase 5: Vertiefung (laufend)

Ziel: Den Garten wachsen lassen

Konzepte

• Callouts — 13 Typen kennen → callout-showcase (kommt)
• Mermaid-Diagramme — Flowcharts, Mindmaps, Gantt → mermaid-diagramme (kommt)
• KaTeX / Mathematik — $inline$, $$block$$
• Tagesnotizen — Daily-Routine einrichten → 06-daily
• Decision Logs — Entscheidungen dokumentieren → 07-decision-log
• Literaturnotizen — Bücher integrieren → 04-literature
• CSS-Klassen — Custom Styling → styling-und-css-classes (kommt)

Meilenstein ✅

Ich pflege meinen Garden regelmäßig. Neue Ideen landen automatisch als Seedlings.

---

📊 Fortschritts-Tracker

Konzept	Status	Notiz
Markdown Basics	✅	Beherrsche ich
Frontmatter	✅	frontmatter-guide
Wikilinks	✅	01-atomic-note
Backlinks	✅	Funktioniert
Tags & Hierarchie	🔄	Noch in Arbeit
MOC-Strategie	🔄	02-moc
Quartz Setup	✅	Lokal läuft es
Deployment	✅	Live auf CF Pages
Callouts	🔄	callout-showcase
Mermaid	⏳	Phase 5
Daily Notes	⏳	Phase 5

---

📖 Ressourcen-Übersicht

Typ	Ressource	Phase
📖 Buch	Lit-Ahrens-How-to-Take-Smart-Notes	1
🔬 Paper	Research-Luhmann-1992-Kommunikation	5
🛠️ Tool	Quartz	4
🗂️ Projekt	Projekt-Digital-Garden-Aufbau	4
🗺️ MOC	MOC-Digital-Garden-Tools	3
🗺️ MOC	MOC-Lernen-und-Methoden	1

---

🌱 Verwandte Notizen

• Zettelkasten-Prinzip — Die Philosophie dahinter
• Warum-Digital-Garden — Motivation für diesen Pfad
• 05-project — Das Aufbau-Projekt selbst
• MOC-Lernen-und-Methoden — Lernmethoden-Kontext

---

Status: 🌿 Budding | Fortschritt: Phase 4 von 5 abgeschlossen