General
Content

Documentation

Learn how to write documentation in the monorepo.

The documentation uses Content Collections, a markdown-based CMS. All content is written and styled using .mdx files. It's markdown combined with React components.

When content changes, you need to redeploy the marketing app because the pages are statically compiled and not dynamically fetched from a database.

Add a new documentation page

To create a new page, follow these steps:

  1. Create a new file Navigate to the /apps/marketing/content/docs directory and create a new .mdx file. The file name will act as the URL slug for the post. For example:

    • File name: hello-world.mdx
    • URL: https://your-app.com/docs/hello-world
  2. Add metadata At the top of the .mdx file, include a frontmatter block. This block contains key metadata about your docs, written in a YAML-like format enclosed by three dashes (---). Here's an example:

apps/marketing/content/docs/hello-world.mdx
---
title: Hello World
description: This is my first documentation page.
---

Add the last item to DOCS_LINKS inside apps/marketing/components/marketing-links.tsx.

apps/marketing/components/marketing-links.tsx
{
  title: 'Guides',
  icon: <BookIcon className="size-4 shrink-0 text-muted-foreground" />,
  items: [
    {
      title: 'Introduction',
      href: '/docs',
      items: []
    },
    {
      title: 'Dependencies',
      href: '/docs/dependencies',
      items: []
    },
    // [\!code highlight:5]
    {
      title: 'Hello World',
      href: '/docs/hello-world',
      items: []
    }
  ]
}

Your docs are automatically added to the search.