Fumadocs

Quick Start

Getting started with core library

Introduction

The core of Fumadocs, built for App Router. It offers server-side functions and headless components.

  • Search (built-in: Flexsearch, Algolia Search)
  • Breadcrumb, Sidebar, TOC Components
  • Remark/Rehype Plugins
  • Additional utilities

Tip

Fumadocs Core can be used without Fumadocs UI, in other words, it's headless.

For beginners and normal usages, use Fumadocs UI.

npm install fumadocs-core

Setup

Choose a Source

We have native support for Fumadocs MDX and Content Collections, but all formats and content sources have be supported via a custom adapter.

Build Page Tree

A page tree refers to the structured data of all pages. It is essential for implementing a sidebar, or other navigation elements.

You can generate the tree using our built-in Source API, the adapter for your content source, or end up with writing your own.

Create MDX file

Create /content/docs/index.mdx:

---
title: Quick Start
description: My cool docs
---
 
Hello World

Styling & Fun

Start styling your docs with headless components.

<article>
  <nav>
    <p>My App</p>
    <SearchToggle />
  </nav>
  <Sidebar />
  <MDXContent />
  <TOC />
</article>

Enjoy!

It offers simple document searching as well as components for building a good docs. It is made for flexibility and speed.

Last updated on

On this page

Edit on Github