---
title: Pages
description: 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:

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

Segments are slugified, and a nested `index` collapses to its directory. See
[Navigation](/docs/authoring/navigation) for all four rules, including the frontmatter
`slug` override.

## Frontmatter

```mdx
---
title: Pages
description: Frontmatter, the page id, and the fixed component catalog.
---

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:

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

<CardGroup cols={2}>
  <Card title="Quickstart" href="/docs/quickstart">
    From nothing to a deployable site in five minutes.
  </Card>
</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:

```mdx
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.
