NextGuide

Add documentation pages

Create pages and update nested sidebar navigation automatically with the NextGuide CLI.

Add a documentation page

Once you have initialized Developer Mode, you can create pages without hunting for folders, editing route files, or manually updating the sidebar.

1. Create a page

Run this command from the root of your Next.js project:

Generate a pageShell
bunx nextguide page add changelog --title "Changelog" --description "Release notes for the project"

NextGuide creates content/docs/changelog.mdx and adds its entry to content/docs/_meta.json. It never overwrites an existing MDX page. The command prints every file created or updated.

After adding changelog
  • content
    • docs
      • _meta.jsonUpdated sidebar order
      • index.mdx
      • getting-started.mdx
      • changelog.mdxYour new page

The generated page includes a title, description and editable MDX body. The route /docs/changelog works automatically; no new page.tsx file is required.

2. Create nested documentation

Directories are created automatically as you add pages:

Create a nested pageShell
bunx nextguide page add guides/installation --title "Installation"

The command creates content/docs/guides/installation.mdx, creates _meta.json inside each new section, and adds the guides section to the root navigation metadata. The page URL is /docs/guides/installation.

To create a section's index page at /docs/guides, use:

Create a section homepageShell
bunx nextguide page add guides/index --title Guides

3. Preview before changing files

Dry-run a page additionShell
bunx nextguide page add api/authentication --dry-run

Dry-run prints the exact files that would be created or modified and makes no changes. For tooling and scripts, add --json to receive machine-readable paths and the URL.

4. Edit the page and run Next.js

Open the generated .mdx file in your editor, replace the placeholder content, then start your existing Next.js dev server:

Start the documentation siteShell
bun run dev

Go to the URL printed by nextguide page add on the port reported by Next.js.

How navigation metadata works

NextGuide reads _meta.json in each folder to control ordering, labels and visibility. The generator appends missing entries and preserves your existing navigation settings, including custom titles and hidden items. You can still rearrange _meta.json manually when you want a particular order.

The command reads the contentDir from nextguide.config.json, so a customized content directory is supported. If the file already exists, or metadata is invalid, the command stops instead of replacing your work.

Developer Mode only

The page generator edits local project files. It needs no account, database or online service. Account Mode and the browser editor are separate features under development and not yet released to npm.

Generated project files · Developer Mode · Component library