Conceptos básicos de MDX
Escribe documentación en Markdown con componentes React como Card, Tabs y Accordion. Es la sintaxis detrás de cada página de Jamdesk.
Toda página de Jamdesk es un archivo .mdx: Markdown estándar con componentes JSX como <Card>, <Tabs> y <Accordion>.
¿Qué es MDX?
MDX te permite escribir Markdown estándar e incrustar componentes JSX en el mismo archivo. Escribe encabezados, listas y bloques de código en Markdown, y luego agrega componentes como <Card> o <Tabs> donde necesites interactividad.
MDX también funciona bien para documentación que las herramientas de IA necesitan leer: es texto plano (por lo que pueden leerlo y escribirlo de forma nativa), versionable en Git, y suficientemente estructurado para componentes sin requerir un formato propietario.
# Welcome to My Docs
This is regular **Markdown** with a component below:
<Card title="Quickstart" icon="rocket" href="/quickstart">
Jump right in with our quickstart guide.
</Card>
Dos herramientas gratuitas de navegador ayudan mientras escribes: el MDX Validator detecta errores de sintaxis antes de un build, y el MDX Formatter limpia el espaciado y la indentación. Pega una página para revisarla o depurarla sin ejecutar el CLI.
Estructura de la página
Toda página MDX comienza con frontmatter, metadatos entre triples guiones:
---
title: My Page Title
description: A brief description for search and previews
---
Your content starts here...
title y description aparecen en resultados de búsqueda, pestañas del navegador y vistas previas en redes sociales. Escríbelos con cuidado.
Elementos esenciales de Markdown
Encabezados
Usa ## para secciones principales y ### para subsecciones. Jamdesk genera automáticamente una tabla de contenidos a partir de tus encabezados.
## Main Section
Content under the main section.
### Subsection
More detailed content here.
Comienza con ## (h2) para tu primer encabezado. El título de la página del frontmatter sirve como h1.
Formato de texto
| Sintaxis | Resultado |
|---|---|
**bold** | bold |
*italic* | italic |
~~strikethrough~~ | |
`inline code` | inline code |
Listas
Unordered list:
- First item
- Second item
- Nested item
Ordered list:
1. First step
2. Second step
3. Third step
Citas
> This is a blockquote. Use it for callouts or
> highlighting important information.
Esto es una cita. Úsala para destacados o para resaltar información importante.
Agregar componentes
Los componentes son elementos JSX que puedes usar en cualquier parte de tu MDX. Se autocierran o envuelven contenido:
{/* Self-closing component */}
<Card title="Example" icon="star" href="/introduction" />
{/* Component wrapping content */}
<Accordion title="Click to expand">
This content is inside the accordion.
</Accordion>
Componentes disponibles
Jamdesk ofrece estos componentes integrados:
Tablas
Las tablas estándar de Markdown funcionan sin configuración adicional:
| Feature | Free | Pro |
|---------|------|-----|
| Pages | 10 | Unlimited |
| Custom domain | No | Yes |
| Feature | Free | Pro |
|---|---|---|
| Pages | 10 | Unlimited |
| Custom domain | No | Yes |
Para funciones avanzadas como resaltado de filas, alineación de celdas y expansión, usa el componente Table:
| Feature | Free | Pro |
|---|---|---|
| Pages | 10 | Unlimited |
| Custom domain | No | Yes |
Consulta Tables para la documentación completa del componente, incluyendo resaltado de filas/celdas, expansión de columnas y opciones de estilo.
Comentarios
Agrega comentarios que no aparecerán en el resultado renderizado:
{/* This is a comment - it won't be visible to readers */}
