Pages

Frontmatter, the page id, and the fixed component catalog.

Every page is an .mdx file under your content directory. Its page id — the string you write in navigation — is derived from its path:

1
content/authoring/pages.mdx   →   page id "authoring/pages"
2
content/Guide/Intro.mdx       →   page id "guide/intro"
3
content/derived/index.mdx     →   page id "derived"

Segments are slugified, and a nested index collapses to its directory. See Navigation for all four rules, including the frontmatter slug override.

Frontmatter

1
---
2
title: Pages
3
description: Frontmatter, the page id, and the fixed component catalog.
4
---
5

6
Body starts here.

title becomes the page’s H1. Do not write an H1 in the body — Reed reports it as a diagnostic, because the page would then render two competing top-level headings. Start your body headings at ##.

description feeds the page’s meta description and its automatically generated structured data. Write one for every page; a page without it inherits nothing useful.

Components

Reed renders MDX through a fixed catalog of 37 named components — there is no arbitrary import surface. They are available in every page without importing anything:

1
<Note>This endpoint is rate-limited to 100 requests per minute.</Note>
2

3
<CardGroup cols={2}>
4
  <Card title="Quickstart" href="/docs/quickstart">
5
    From nothing to a deployable site in five minutes.
6
  </Card>
7
</CardGroup>

A component name outside the catalog is a DS-S06 diagnostic rather than a silent render failure, so a typo surfaces at reed check time.

Links

Reed does not rewrite links you write in prose. If your site sets base, root- relative links have to include it themselves:

1
See the [Quickstart](/docs/quickstart).

Writing /quickstart on a site mounted at /docs compiles cleanly and 404s in production. This is the single easiest mistake to make in a Reed project, and it applies to component attributes too — a <Card href="/quickstart"> is wrong in exactly the same way. Links inside docs.json (footer columns, redirects) follow the opposite rule: they are root-relative without the base, and Reed adds the prefix.

Fenced code blocks inside components

MDX parses a fenced code block inside a JSX element differently from one at the top level, which is a common source of confusing build failures. Keep fenced blocks at the top level of the page rather than nesting them inside <Card>, <Step> or <Tab> until you have a reason not to.