Content & Documentation

Nextra Documentation

Build Next.js-powered documentation sites with Nextra using MDX and file-system routing.

Claude Code Cursor Copilot

Overview

Nextra is a Next.js-based documentation framework that combines file-system routing with MDX content. AI coding agents can create documentation pages, configure themes, and manage the _meta.json navigation files that control sidebar structure.

Agents can generate MDX documentation with proper formatting, configure Nextra's docs or blog theme, set up search integration, and manage page ordering through _meta.json files. Nextra's simple file-based routing makes it easy for agents to scaffold and maintain documentation.

Nextra supports features like full-text search, syntax highlighting, callouts, tabs, and dark mode. Teams can use AI agents to rapidly create and maintain documentation sites with Next.js performance benefits and React component integration.

Who Is This For?

Scaffold Nextra documentation site with proper structure
Generate MDX pages with navigation configuration
Configure search and theme customization
Create API documentation with code examples

Installation

Setup for Claude Code

npm install nextra nextra-theme-docs next react react-dom

Configuration

// next.config.mjs
import nextra from 'nextra';

const withNextra = nextra({
  theme: 'nextra-theme-docs',
  themeConfig: './theme.config.tsx',
});

export default withNextra({});

// theme.config.tsx
export default {
  logo: <span>My Documentation</span>,
  project: { link: 'https://github.com/user/repo' },
  docsRepositoryBase: 'https://github.com/user/repo/tree/main/docs',
};