Getting Started with Fumadocs

Meet Fumadocs

Fumadocs (Foo-ma docs) is a documentation framework built on top of Next.js. Its goal is to stay fast, flexible, and easy to compose into the Next.js App Router.

The project is made up of several parts:

A Few Terms First

Markdown/MDX: Markdown is a markup language for writing formatted text. Fumadocs supports both Markdown and MDX (a superset of Markdown) out of the box.

It also helps to know the basics of Next.js App Router if you want to customize the setup later.

Create a Project Automatically

You need Node.js 18 or newer. Be aware that Node.js 23.1 may cause issues when building Next.js for production.

npm create fumadocs-app

pnpm create fumadocs-app

yarn create fumadocs-app

bun create fumadocs-app

The generator asks which framework and content source you want, then scaffolds a new Fumadocs app for you.

First Page

After setup, create your first MDX file in the docs directory.

---
title: Hello World
---

## Yo what's up

Run the development server, then open http://localhost:3000/docs.

npm run dev

Explore the Generated Project

A new project usually includes:

• lib/source.ts: The content source adapter. loader() gives you an interface for reading content and assigning URLs to pages.
• app/layout.config.tsx: Shared layout options. It is optional, but recommended to keep.

Writing Docs

When you start authoring content, these pages are especially useful:

Content Sources

The content source is responsible for your document pipeline, including compiling Markdown and validating frontmatter.

Customize the UI

See Customisation Guide.

FAQ

Below are a few common questions people run into when starting out.

Learn More

If you are new here, questions are always welcome.

If you find anything confusing, please give your feedback on Github Discussion!