---
title: Write & Organize Overview
sidebarTitle: Writing Overview
description: >-
  Everything about authoring Jamdesk pages: MDX syntax, code blocks, media
  embeds, SEO, and the tools for previewing your work before it ships.
---

> **For AI agents:** the complete documentation index is at [llms.txt](/docs/llms.txt). Append `.md` to any page URL for its markdown version.

Jamdesk pages are MDX files: standard Markdown with React components available wherever you need them. A page is just frontmatter plus content.

```mdx
---
title: Rate Limits
description: How rate limiting works across API tiers.
---

Requests are limited per API key.

<Note>Enterprise plans have custom limits.</Note>
```

Most of what you'll write is plain Markdown. The pages in this section cover the rest: code blocks with syntax highlighting, images and video, math notation, reusable snippets, and the frontmatter fields that control titles, icons, and SEO metadata.

## MDX & Pages

<Columns cols={3}>
  <Card title="MDX Basics" icon="pen-to-square" href="/content/mdx-basics">
    Markdown with embedded React components. Start here.
  </Card>
  <Card title="Code Blocks" icon="code" href="/content/code-blocks">
    Syntax highlighting, line numbers, filenames, and CodeGroups
  </Card>
  <Card title="Custom React Components" icon="puzzle-piece" href="/content/react-components">
    Define your own components with server-side rendering and Tailwind
  </Card>
  <Card title="Frontmatter" icon="file-lines" href="/content/frontmatter">
    Titles, descriptions, icons, sidebar overrides, and SEO metadata
  </Card>
  <Card title="Headers" icon="heading" href="/content/headers">
    H2 and H3 headers that populate the table of contents
  </Card>
  <Card title="Icons" icon="icons" href="/content/icons">
    Font Awesome Pro icons in cards, callouts, navigation, and inline text
  </Card>
  <Card title="Links & Anchors" icon="link" href="/content/links">
    Internal links, heading anchors, and external URLs
  </Card>
  <Card title="Math & LaTeX" icon="square-root-variable" href="/content/math">
    KaTeX rendering for equations and expressions
  </Card>
  <Card title="SEO" icon="magnifying-glass" href="/content/seo">
    Meta tags, social previews, and auto-generated sitemaps
  </Card>
  <Card title="Hidden Pages" icon="eye-slash" href="/content/hidden-pages">
    Keep pages out of the sidebar and search without deleting them
  </Card>
  <Card title="Snippets" icon="clone" href="/content/snippets">
    Reusable content blocks you import across pages
  </Card>
</Columns>

## Media & Embeds

<Columns cols={2}>
  <Card title="Images" icon="image" href="/content/images">
    Sizing, captions, light/dark variants, and supported formats
  </Card>
  <Card title="YouTube" icon="circle-play" href="/content/youtube">
    Lazy-loaded videos and Shorts with custom start times
  </Card>
  <Card title="Videos" icon="video" href="/content/videos">
    MP4 and WebM with autoplay, loop, and poster props
  </Card>
  <Card title="iFrames" icon="window-restore" href="/content/iframes">
    Vimeo, CodePen, Figma, Loom, and other external embeds
  </Card>
</Columns>

## Authoring Tools

You don't have to push to see your changes. Preview locally with the CLI, edit in the browser, or control the dev server from VS Code.

<Columns cols={3}>
  <Card title="Local Preview" icon="terminal" href="/development/local-preview">
    Run your docs on your machine with instant reloads
  </Card>
  <Card title="Web Editor" icon="browser" href="/development/web-editor">
    Edit MDX in the browser with live preview, commit straight to your repo
  </Card>
  <Card title="VS Code Extension" icon="square-code" href="/development/vscode-extension">
    Start and stop the dev server from the status bar
  </Card>
</Columns>