Einführung
Onedocs ist eine Sammlung von Layouts, Komponenten und Hilfsfunktionen für Dokuwebsites mit Next.js und Fumadocs. Du schreibst Markdown, beschreibst deine Website in einer Konfigurationsdatei und erhältst von Onedocs das Doku-Grundgerüst, eine Startseite und die SEO-Routen.
Es ist für eigenständige Dokumentationswebsites gedacht, nicht dafür, einer vorhandenen Anwendung eine Doku hinzuzufügen.
Was Onedocs bietet
Zusätzlich zu Fumadocs bietet dir das onedocs-Paket:
- Layouts –
DocsLayoutundDocsPageumschließen das Fumadocs-UI-Docs-Layout mit Seitenleiste, Suche, Theme-Umschalter und Inhaltsverzeichnis.HomePagerendert eine Landingpage mit Hero-Bereich, Installationsbefehlen, Features und Fußzeile. - Eine Konfigurationsdatei –
onedocs.config.tsenthält Titel, Beschreibung, Logo, Favicon, Navigationslinks, Fußzeile und Inhalte der Startseite. - MDX-Komponenten –
mdxComponentsregistriert Infoboxen, Tabs, Karten, Schritte, Akkordeons, Dateibäume, Bildzoom und Typentabellen, sodass Seiten sie ohne Importe verwenden können. - CSS-Preset – Ein Import bindet Tailwind CSS v4, das Fumadocs-UI-Theme und die Onedocs-Layout-Styles ein.
- SEO-Hilfsfunktionen – Funktionen für
sitemap.xml,robots.txt,llms.txt,llms-full.txt, Seitenmetadaten und Open Graph-Bilder.
Was du selbst einrichtest
Onedocs bündelt weder Next.js noch Fumadocs. Beides sind Peer-Abhängigkeiten, die du zusätzlich installierst:
npm install onedocs fumadocs-core fumadocs-mdx fumadocs-ui lucide-react@0.562 next react react-dom
Außerdem benötigst du Tailwind CSS v4, Node.js 20.9 oder neuer sowie etwa zehn kleinere Dateien: die Next.js- und Fumadocs-MDX-Konfiguration, eine Inhaltsquelle, das Root-Layout, das Docs-Layout und die Docs-Seitenroute. Unter Erste Schritte werden alle Dateien vorgestellt.
Wo du was konfigurierst
| Was | Wo |
|---|---|
| Websitetitel, Logo, Navigation, Fußzeile | onedocs.config.ts, siehe Konfiguration |
| Hero-Bereich und Features der Startseite | homepage in onedocs.config.ts, gerendert von HomePage in src/app/page.tsx |
| Docs-Layout und Seiten | src/app/docs/layout.tsx und src/app/docs/[[...slug]]/page.tsx, siehe Erste Schritte |
| Inhaltsordner und Reihenfolge der Seitenleiste | source.config.ts und content/docs/meta.json |
| MDX-Komponenten | mdxComponents, siehe Komponenten |
| Suche, Sitemap, robots.txt, llms.txt | Routendateien unter src/app/, siehe SEO und Suche |
| Metadaten und Open Graph-Bilder | onedocs/metadata und onedocs/og, siehe API-Referenz |
Leitbild
- Markdown-first – Schreibe
.md- oder.mdx-Dateien und erhalte deine Doku - Eine Konfigurationsdatei – Websiteweite Einstellungen stehen in
onedocs.config.ts - Erweiterungsmöglichkeiten – Du brauchst mehr Kontrolle? Verwende Fumadocs direkt