https://github.com/rit3zh/modern-docs-template
🗂️ My go-to documentation setup for every project built with 🧠 Fumadocs and ⚡ Next.js. Minimal, customizable, and designed for devs who actually care about good docs.
https://github.com/rit3zh/modern-docs-template
docs docs-template fumadocs next react
Last synced: 3 months ago
JSON representation
🗂️ My go-to documentation setup for every project built with 🧠 Fumadocs and ⚡ Next.js. Minimal, customizable, and designed for devs who actually care about good docs.
- Host: GitHub
- URL: https://github.com/rit3zh/modern-docs-template
- Owner: rit3zh
- Created: 2025-06-24T10:30:15.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2025-06-24T11:06:15.000Z (4 months ago)
- Last Synced: 2025-06-24T11:36:55.647Z (4 months ago)
- Topics: docs, docs-template, fumadocs, next, react
- Language: TypeScript
- Homepage: https://modern-docs-template.vercel.app
- Size: 3.3 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
📘 Modern Doc Template
A minimalist documentation system built with Next.js and powered by Fumadocs.
✨ [Check out the live demo by clicking here!](https://modern-docs-template.vercel.app/)
## ⚙️ Getting Started
Install dependencies and run the development server:
```bash
$ git clone https://github.com/rit3zh/modern-docs-template
$ cd modern-docs-template
```
Running the development server
```bash
$ pnpm install
$ pnpm dev
```
Visit [http://localhost:3000](http://localhost:3000) in your browser.
## 📁 Project Structure
```bash
.
├── 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.)
```
---
## ✍️ How to Write Docs
1. Create `.mdx` pages inside the `app/docs/` folder.
Example:
```bash
app/docs/guide/getting-started.mdx
```
2. Customize sidebar, groups, and ordering in `source.config.ts` using `defineConfig()`.
3. Use Fumadocs UI components directly in your MDX:
```mdx
import { Card } from "fumadocs-ui/components/card";
```
Learn more in the [Fumadocs MDX Guide →](https://fumadocs.dev/docs/mdx)
---
## 🛠 Customization
| 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 |
---
## 📚 Learn More
- 🔗 [Fumadocs Documentation](https://fumadocs.dev)
- 🔗 [Next.js Documentation](https://nextjs.org/docs)
- 🔗 [Learn Next.js](https://nextjs.org/learn)
---
## 💬 Community & Support
- 🐙 GitHub: [github.com/rit3zh/modern-doc-template](https://github.com/rit3zh/modern-doc-template)
- 💬 Discord: [Rit3zh](http://discordapp.com/users/755101874268536893)
- ☕ Buy Me a Coffee: [buymeacoffee.com/rit3zh](https://buymeacoffee.com/rit3zh)
> Built with ❤️ by [rit3zh](https://github.com/rit3zh) — clean, fast, and fully extensible.