--- title: MDX Basics description: Write documentation in Markdown with embedded React components like Card, Tabs, and Accordion -- the syntax behind every Jamdesk page. --- > **For AI agents:** the complete documentation index is at [llms.txt](/docs/llms.txt). Append `.md` to any page URL for its markdown version. Every Jamdesk page is an `.mdx` file -- standard Markdown with JSX components like ``, ``, and ``. ## What is MDX? MDX combines the simplicity of Markdown with the power of JSX. Write headings, lists, and code blocks in Markdown, then drop in components like `` or `` wherever you need interactivity. MDX is also one of the best formats for documentation that needs to be AI-readable. It's plain text (so AI tools can read and write it natively), version-controllable in Git, and structured enough for components without requiring a proprietary format. ```mdx # Welcome to My Docs This is regular **Markdown** with a component below: Jump right in with our quickstart guide. ``` ## Page Structure Every MDX page starts with frontmatter - metadata between triple dashes: ```mdx --- title: My Page Title description: A brief description for search and previews --- Your content starts here... ``` The `title` and `description` appear in search results, browser tabs, and social media previews. Write them thoughtfully. ## Markdown Essentials ### Headings Use `##` for main sections and `###` for subsections. Jamdesk automatically generates a table of contents from your headings. ```markdown ## Main Section Content under the main section. ### Subsection More detailed content here. ``` Start with `##` (h2) for your first heading. The page title from frontmatter serves as the h1. ### Text Formatting | Syntax | Result | |--------|--------| | `**bold**` | **bold** | | `*italic*` | *italic* | | `~~strikethrough~~` | ~~strikethrough~~ | | `` `inline code` `` | `inline code` | ### Lists ```markdown Unordered list: - First item - Second item - Nested item Ordered list: 1. First step 2. Second step 3. Third step ``` ### Blockquotes ```markdown > This is a blockquote. Use it for callouts or > highlighting important information. ``` > This is a blockquote. Use it for callouts or highlighting important information. ## Adding Components Components are JSX elements you can use anywhere in your MDX. They're self-closing or wrap content: ```mdx {/* Self-closing component */} {/* Component wrapping content */} This content is inside the accordion. ``` ### Available Components Jamdesk provides a rich set of built-in components: Highlight features and create navigation Organize content into switchable panels Collapsible sections for optional content Numbered procedures and tutorials ## Tables Standard Markdown tables work out of the box: ```markdown | Feature | Free | Pro | |---------|------|-----| | Pages | 10 | Unlimited | | Custom domain | No | Yes | ``` | Feature | Free | Pro | |---------|------|-----| | Pages | 10 | Unlimited | | Custom domain | No | Yes | For advanced features like row highlighting, cell alignment, and spanning, use the Table component: Feature Free Pro Pages 10 Unlimited Custom domain No Yes

See [Tables](/components/tables) for full component documentation including row/cell highlighting, column spanning, and styling options. ## Comments Add comments that won't appear in the rendered output: ```mdx {/* This is a comment - it won't be visible to readers */} ``` ## What's Next? Improve discovery and metadata Define titles, descriptions, and SEO fields