---
title: Cajón de código
slug: docs/es/cajon-de-codigo
docTags: 
createdAt: 2026-06-05T12:51:26.902Z
---

[Cajón de código](docId:2doQ1QCwZcibdtp1EyMJq) muestran ejemplos de solicitudes y muestras de respuestas en la columna derecha de un diseño de dos columnas. Úselos para crear documentación de API interactiva.

## Sintaxis

Usted puede agregar este componente usando Markdown o MDX.

::::Tabs
:::Tab{title="Markdown"}
```markdown
::::CodeDrawer{title="Endpoint Name"}
:::CodeblockTabsExamples
(Code blocks with request examples)
:::
:::CodeblockTabsResponses
(Code blocks with response examples)
:::
::::
```
:::

:::Tab{title="MDX"}
```javascript
<CodeDrawer title="Endpoint Name">
  <CodeblockTabsExamples>
    (Code blocks with request examples)
  </CodeblockTabsExamples>
  <CodeblockTabsResponses>
    (Code blocks with response examples)
  </CodeblockTabsResponses>
</CodeDrawer>
```
:::
::::

Un cajón de código consta de dos secciones:

- `CodeblockTabsExamples` para ejemplos de solicitudes.&#x20;
- `CodeblockTabsResponses` para muestras de respuestas.&#x20;

Cada sección puede contener uno o más bloques de código con vallas. Cuando hay varios bloques de código, se agrupan automáticamente en pestañas por lenguaje.

Los cajones de código se muestran en la columna derecha cuando se usan dentro de un diseño de dos columnas.

## Ejemplo de MDX

El siguiente ejemplo crea un cajón de código con ejemplos de solicitudes en JavaScript, Python y Bash, junto con respuestas exitosas y de error.

````javascript
<CodeDrawer title="Create a User">
  <CodeblockTabsExamples>

  ```javascript
  const response = await fetch('https://api.example.com/users', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': 'Bearer sk_live_xxx'
    },
    body: JSON.stringify({
      name: 'Jane Doe',
      email: 'jane@example.com',
      role: 'admin'
    })
  })
  const user = await response.json()
  ```

  ```python
  import requests

  response = requests.post('https://api.example.com/users', json={
      'name': 'Jane Doe',
      'email': 'jane@example.com',
      'role': 'admin'
  }, headers={
      'Authorization': 'Bearer sk_live_xxx'
  })
  user = response.json()
  ```

  ```bash
  curl -X POST https://api.example.com/users \
    -H "Content-Type: application/json" \
    -H "Authorization: Bearer sk_live_xxx" \
    -d '{"name":"Jane Doe","email":"jane@example.com","role":"admin"}'
  ```

  </CodeblockTabsExamples>

  <CodeblockTabsResponses>

  ```json
  {
    "id": "usr_abc123",
    "name": "Jane Doe",
    "email": "jane@example.com",
    "role": "admin",
    "createdAt": "2026-04-01T10:00:00Z"
  }
  ```

  ```json
  {
    "error": "Validation failed",
    "message": "Email already exists",
    "code": 409
  }
  ```

  </CodeblockTabsResponses>
</CodeDrawer>
````