Fumadocs

What it is

Fumadocs is a documentation framework designed for developers to build and deploy documentation websites. It is a flexible, performant, and headless solution that runs on React-based frameworks like Next.js. It is aimed at developers and teams who want to avoid rebuilding documentation sites from scratch for each new project.

Main Features

Content Source Integration

• Source-agnostic design that integrates with various content sources including Fumadocs MDX, Content Collections, and external CMS platforms like BaseHub, Sanity, and Payload CMS.

Search Integration

• Native support for integrating full-text search using Orama Search and Algolia Search.
• Includes a route handler for easy setup and the option to use a custom search modal.

Development & Tooling

• Includes a CLI for adding interactive components to documentation.
• Features syntax highlighting via Shiki, TypeScript Twoslash support, and OpenAPI documentation generation.
• Offers automation tools and type-safe data validation for content.

Performance & Design

• Built with React Server Components for light and fast performance.
• Images are optimized by default.
• Focus on accessibility and user experience.
• Advanced theming and customization options.

How it works

Creating a New Documentation Project

Users initialize a new documentation project using a command-line interface (CLI) command (npm create fumadocs-app). This sets up a new application with a chosen content source.

Writing and Managing Content

Content is written in Markdown or MDX files. The framework provides automation tools and validates data in a type-safe manner. It can transform this content into data for use in React frameworks.

Deploying Documentation

The built documentation site can be easily deployed to various hosting platforms, such as Vercel or Netlify, directly from the framework.

Key Points

• The framework is described as the Shadcn UI for docs, emphasizing its component-based, composable nature.
• It is designed to be framework-agnostic, working with Next.js, React Router, and Tanstack Start.
• It is open-source and actively maintained, with a focus on community contributions.
• The project has received positive endorsements from developers in the ecosystem, including the creator of Shadcn UI and a Turbo DX at Vercel.

Additional Details

• Pricing: Fumadocs is fully open-source and free to use.
• Availability: The source code is available on GitHub under the fuma-nama organization.
• Requirements: The framework requires a React-based environment like Next.js.
• Demo: A live demo is available on StackBlitz for users to explore its functionality.