![]() |
![]() |
A minimalist documentation system built with Next.js and powered by Fumadocs.
β¨ Check out the live demo by clicking here!
Install dependencies and run the development server:
$ git clone https://github.com/rit3zh/modern-docs-template
$ cd modern-docs-template
Running the development server
$ pnpm install
$ pnpm dev
Visit http://localhost:3000 in your browser.
.
βββ app/
β βββ (home)/ # Landing and custom pages
β βββ docs/ # MDX-based documentation
β βββ api/search/ # Search API route
βββ lib/source.ts # Fumadocs content adapter (loader)
βββ layout.config.tsx # Layout options
βββ source.config.ts # MDX config (frontmatter, sidebar, etc.)
-
Create
.mdx
pages inside theapp/docs/
folder. Example:app/docs/guide/getting-started.mdx
-
Customize sidebar, groups, and ordering in
source.config.ts
usingdefineConfig()
. -
Use Fumadocs UI components directly in your MDX:
import { Card } from "fumadocs-ui/components/card"; <Card title="Welcome" href="/docs/start" />
Learn more in the Fumadocs MDX Guide β
Feature | How to Customize |
---|---|
Branding | Update logo, favicon, meta in app/layout.tsx |
Navigation | Edit sidebar/nav in source.config.ts |
Theme | Light/dark support is built-in |
Search | Tweak app/api/search/route.ts for search behavior |
- π Fumadocs Documentation
- π Next.js Documentation
- π Learn Next.js
- π GitHub: github.com/rit3zh/modern-doc-template
- π¬ Discord: Rit3zh
- β Buy Me a Coffee: buymeacoffee.com/rit3zh
Built with β€οΈ by rit3zh β clean, fast, and fully extensible.