> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify-mintlify-add-i-to-quickstart-8818.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Playground

> Permite que los usuarios interactúen con tu API

<div id="overview">
  ## Descripción general
</div>

El Área de pruebas de API es un entorno interactivo que permite a los usuarios probar y explorar tus endpoints de API. Los desarrolladores pueden crear solicitudes de API, enviarlas y ver las respuestas sin salir de tu documentación.

<Frame>
  <img src="https://mintcdn.com/mintlify-mintlify-add-i-to-quickstart-8818/foJqm5unL7FbRYPD/images/playground/API-playground-light.png?fit=max&auto=format&n=foJqm5unL7FbRYPD&q=85&s=8e0923bf2c287aa354131756be28a7de" alt="Área de pruebas de API para el endpoint que activa una actualización." className="block dark:hidden" width="2534" height="1022" data-path="images/playground/API-playground-light.png" />

  <img src="https://mintcdn.com/mintlify-mintlify-add-i-to-quickstart-8818/foJqm5unL7FbRYPD/images/playground/API-playground-dark.png?fit=max&auto=format&n=foJqm5unL7FbRYPD&q=85&s=19d3d694545813d8a0e0f8aa1770cebd" alt="Área de pruebas de API para el endpoint que activa una actualización." className="hidden dark:block" width="2534" height="1022" data-path="images/playground/API-playground-dark.png" />
</Frame>

El Área de pruebas se genera automáticamente a partir de tu especificación OpenAPI o del esquema AsyncAPI, por lo que cualquier actualización de tu API se refleja automáticamente allí. También puedes crear manualmente páginas de referencia de API después de definir una URL base y un método de autenticación en tu `docs.json`.

Recomendamos generar tu Área de pruebas de API a partir de una especificación OpenAPI. Consulta [Configuración de OpenAPI](/es/api-playground/openapi-setup) para obtener más información sobre cómo crear tu documento de OpenAPI.

<div id="getting-started">
  ## Primeros pasos
</div>

<Steps>
  <Step title="Add your OpenAPI specification file.">
    <Info>
      Asegúrate de que tu archivo de especificación de OpenAPI sea válido usando el [Swagger Editor](https://editor.swagger.io/) o el [Mint CLI](https://www.npmjs.com/package/mint).
    </Info>

    ```bash {3}
    /your-project
      |- docs.json
      |- openapi.json
    ```
  </Step>

  <Step title="Configure `docs.json`.">
    Actualiza tu `docs.json` para hacer referencia a tu especificación de OpenAPI. Agrega una propiedad `openapi` a cualquier elemento de navegación para rellenar automáticamente tu documentación con páginas para cada endpoint especificado en tu documento de OpenAPI.

    Este ejemplo genera una página para cada endpoint especificado en `openapi.json` y las organiza en el grupo "API reference" de tu navegación.

    ```json
    "navigation": {
      "groups": [
        {
          "group": "API reference",
          "openapi": "openapi.json"
        }
      ]
    }
    ```

    Para generar páginas solo para endpoints específicos, enumera los endpoints en la propiedad `pages` del elemento de navegación.

    Este ejemplo genera páginas solo para los endpoints `GET /users` y `POST /users`. Para generar otras páginas de endpoints, agrega endpoints adicionales al arreglo `pages`.

    ```json
    "navigation": {
      "groups": [
          {
            "group": "API reference",
            "openapi": "openapi.json",
            "pages": [
              "GET /users",
              "POST /users"
            ]
          }
      ]
    }
    ```
  </Step>
</Steps>

<div id="customizing-your-playground">
  ## Personalizar tu área de pruebas
</div>

Puedes personalizar tu Área de pruebas de API definiendo las siguientes propiedades en tu `docs.json`.

<ResponseField name="playground" type="object">
  Configuración del Área de pruebas de API.

  <Expandable title="playground" defaultOpen="True">
    <ResponseField name="display" type="&#x22;interactive&#x22; | &#x22;simple&#x22; | &#x22;none&#x22;">
      El modo de visualización del Área de pruebas de API.

      * `"interactive"`: Muestra el área de pruebas interactiva.
      * `"simple"`: Muestra un endpoint copiable sin área de pruebas.
      * `"none"`: No muestra nada.

      Valor predeterminado: `interactive`.
    </ResponseField>

    <ResponseField name="proxy" type="boolean" defaultOpen="True">
      Indica si las solicitudes de API se enrutan a través de un servidor proxy. Valor predeterminado: `true`.
    </ResponseField>
  </Expandable>
</ResponseField>

<ResponseField name="examples" type="object">
  Configuración de los ejemplos de API generados automáticamente.

  <Expandable title="examples" defaultOpen="True">
    <ResponseField name="languages" type="array of string">
      Lenguajes para los Fragmentos de API generados automáticamente.

      Se muestran en el orden especificado.
    </ResponseField>

    <ResponseField name="defaults" type="&#x22;required&#x22; | &#x22;all&#x22;">
      Indica si se muestran los parámetros opcionales en los ejemplos de API. Valor predeterminado: `all`.
    </ResponseField>
  </Expandable>
</ResponseField>

<div id="example-configuration">
  ### Ejemplo de configuración
</div>

```json
{
 "api": {
   "playground": {
     "display": "interactivo"
   },
   "examples": {
     "languages": ["curl", "python", "javascript"],
     "defaults": "obligatorio"
   }
 }
}
```

Este ejemplo configura el área de pruebas de API para que sea interactiva e incluya fragmentos de código de ejemplo para cURL, Python y JavaScript. Solo se muestran los parámetros obligatorios en los fragmentos de código.

<div id="custom-endpoint-pages">
  ### Páginas personalizadas de endpoints
</div>

Cuando necesites más control sobre la documentación de tu API, usa la extensión `x-mint` en tu especificación de OpenAPI o crea páginas `MDX` individuales para tus endpoints.

Ambas opciones te permiten:

* Personalizar los metadatos de la página
* Agregar contenido adicional, como ejemplos
* Controlar el comportamiento del playground por página

Se recomienda la extensión `x-mint` para que toda tu documentación de API se genere automáticamente a partir de tu especificación de OpenAPI y se mantenga en un solo archivo.

Se recomiendan las páginas `MDX` individuales para APIs pequeñas o cuando quieras experimentar con cambios por página.

Para obtener más información, consulta [Extensión x-mint](/es/api-playground/openapi-setup#x-mint-extension) y [Configuración de MDX](/es/api-playground/mdx/configuration).

<div id="further-reading">
  ## Lecturas adicionales
</div>

* [Configuración de AsyncAPI](/es/api-playground/asyncapi/setup) para obtener más información sobre cómo crear tu esquema de AsyncAPI y generar páginas de referencia de WebSocket.
