Benutzerdefinierte Komponenten verwenden

Es gibt eine Reihe von vorgefertigten Komponenten, die für Dokumentationsseiten nützlich sind und bereits in Tajo enthalten sind. Sie können jedoch auch Ihre eigenen benutzerdefinierten Komponenten einbinden. Dies können Sie einfach tun, indem Sie sie in Ihre .mdx-Dateien importieren.

Tip

Fügen Sie die Klasse not-content zur Komponente hinzu, um alle Standard-Markdown-Stilisierungen zu deaktivieren.

Beispiel einer benutzerdefinierten Komponente

Hier ist ein Beispiel, wie Sie eine benutzerdefinierte React-Komponente in Ihre Dokumentation einbinden können:

---
// Importieren Sie Ihre Komponente
import MeineKomponente from '../components/MeineKomponente.astro';
---
Hier ist etwas Text, gefolgt von meiner benutzerdefinierten Komponente:
<MeineKomponente />
Und hier ist mehr Text nach der Komponente.

Verfügbare vorgefertigte Komponenten

Tajo wird mit mehreren nützlichen Komponenten für Dokumentationsseiten geliefert:

Badge Komponente

Zeigt kleine Kennzeichnungen oder Status-Indikatoren an.

Button Komponente

Interaktive Schaltflächen mit verschiedenen Stilen und Größen.

Tabs Komponente

Organisiert Inhalte in umschaltbare Registerkarten.

Aside Komponente

Hebt wichtige Informationen, Tipps oder Warnungen hervor.

Steps Komponente

Zeigt sequenzielle Anleitungen oder Prozesse an.

Bewährte Praktiken

Beim Erstellen benutzerdefinierter Komponenten für Ihre Dokumentation:

  • Zugänglichkeit: Stellen Sie sicher, dass Komponenten zugänglich sind und semantische HTML-Elemente verwenden
  • Responsive Design: Komponenten sollten auf verschiedenen Bildschirmgrößen gut funktionieren
  • Konsistenz: Halten Sie sich an das Design-System und die Stilrichtlinien Ihrer Site
  • Performance: Optimieren Sie Komponenten für schnelle Ladezeiten
  • Dokumentation: Dokumentieren Sie die Props und Verwendung Ihrer Komponenten

Weitere Informationen zu spezifischen Komponenten finden Sie in den entsprechenden Dokumentationsabschnitten.