Fumadocs üzerinde Next.js belgeleri
Next.js ve Fumadocs ile oluşturulan belge siteleri için düzenler, ana sayfa ve SEO yardımcıları.
npm install onedocs fumadocs-core fumadocs-mdx fumadocs-ui lucide-react@0.562En son sürüm 0.1.27 MIT Next.js 16, Node 20.9+
import { HomePage, CTASection } from "onedocs";
export default function Home() {
return (
<HomePage config={config} packageName="my-package">
<CTASection
title="Ready to get started?"
cta={{ label: "Read the Docs", href: "/docs" }}
/>
</HomePage>
);
}Uygulamada
Onedocs, tek bir yapılandırma nesnesini Fumadocs UI düzenlerine iletir.
Tek yapılandırma, tek düzen
onedocs.config.ts; site başlığını, açıklamasını ve GitHub deposunu tutar. DocsLayout bunu, Fumadocs kaynağınızdaki sayfa ağacıyla birlikte okur.
Düzen; kenar çubuğunu, tema geçiş düğmesini, nav.github temel alınarak oluşturulmuş bir GitHub bağlantısını ve eklediğiniz bir /api/search rotasını sorgulayan arama iletişim kutusunu görüntüler.
Başlangıç kılavuzu diğer dosyaları gösterir: içerik kaynağını, Next.js yapılandırmasını, kök düzeni ve sayfa rotasını.
import { defineConfig } from "onedocs/config";
export default defineConfig({
title: "My Docs",
description: "Documentation for my project",
nav: {
github: "username/repo",
},
});import { DocsLayout } from "onedocs";
import type { ReactNode } from "react";
import { source } from "@/lib/source";
import config from "../../../onedocs.config";
export default function Layout({ children }: { children: ReactNode }) {
return (
<DocsLayout config={config} pageTree={source.pageTree}>
{children}
</DocsLayout>
);
}Hazır Düzenler
DocsLayout, DocsPage ve HomePage; kenar çubuğu, arama ve içindekiler tablosu bulunan bir belge iskeletinin yanı sıra bir açılış sayfası sunar.
Tek Yapılandırma Dosyası
onedocs.config.ts içindeki defineConfig(); başlığı, açıklamayı, logoyu, gezinme bağlantılarını, alt bilgiyi ve ana sayfanın kahraman bölümünü ve özelliklerini ayarlar.
Önce Markdown
İçerik klasörünüze .md veya .mdx dosyaları yazın; her sayfada söz dizimi vurgulama ve içindekiler tablosu bulunur.
Arama
Fumadocs yerleşik Orama araması. createFromSource ile tek bir API rotası ekleyin; arama iletişim kutusu bu rotayı kullanır.
Koyu Mod
Açık ve koyu temalar Fumadocs UI tarafından sağlanır; belgeler düzeninde tema geçiş düğmesi bulunur. Logolar ve favicon'lar açık ve koyu varyantları kabul eder.
TypeScript Hazır
TypeScript desteği; tür güvenli yapılandırma ve düzenleyicinizde otomatik tamamlama.
SEO ve llms.txt
sitemap.xml, robots.txt, llms.txt, llms-full.txt, sayfa meta verileri ve Open Graph görseller için yardımcılar.
Özelleştirilebilir
Belgeleriniz üzerinde daha fazla kontrol gerektiğinde Fumadocs bileşenlerine doğrudan erişim sağlar.
Onedocs kılavuzunun tamamına göz atın: kurulum ve ilk kullanımdan gelişmiş iş akışlarına ve API ayrıntılarına kadar.