</div>

Abre tu navegador en <a href="http://127.0.0.1:8000" class="external-link" target="_blank">http://127.0.0.1:8000</a>.

Verás una página simple como:

<img src="/img/tutorial/websockets/image01.png">

Puedes escribir mensajes en el cuadro de entrada y enviarlos:

<img src="/img/tutorial/websockets/image02.png">

Y tu aplicación **FastAPI** con WebSockets responderá de vuelta:

<img src="/img/tutorial/websockets/image03.png">

<font color="#4E9A06">INFO</font>:     Application startup complete.
</pre>
```

</div>

Es **ALTAMENTE recomendable** que escribas o copies el código, lo edites y lo ejecutes localmente.

Usarlo en tu editor es lo que realmente te muestra los beneficios de FastAPI, al ver cuán poco código tienes que escribir, todos los chequeos de tipos, autocompletado, etc.

---

## Instalar FastAPI

El primer paso es instalar FastAPI.

///

Y si lo haces, tendrás un pequeño formulario de autorización para escribir un `username` y `password` (y otros campos opcionales):

<img src="/img/tutorial/security/image02.png">

/// note | Nota

No importa lo que escribas en el formulario, aún no funcionará. Pero llegaremos allí.

///

* hard dependencies: dependencias obligatorias (do not translate to "dependencias duras")
* locking: locking (do not translate to "bloqueo")
* testing (as in software testing): escribir pruebas (do not translate to "probar")
* code base: code base (do not translate to "base de código")
* default: por defecto (do not translate to "predeterminado")

///

## Escribir el código de documentación del callback

Este código no se ejecutará en tu aplicación, solo lo necesitamos para *documentar* cómo debería verse esa *API externa*.

Puedes configurarlos de la siguiente manera:

{* ../../docs_src/metadata/tutorial001.py hl[3:16, 19:32] *}

/// tip | Consejo

Puedes escribir Markdown en el campo `description` y se mostrará en el resultado.

///

Con esta configuración, la documentación automática de la API se vería así:

<img src="/img/tutorial/metadata/image01.png">

///

## Declarar metadatos

Puedes declarar todos los mismos parámetros que para `Query`.

Por ejemplo, para declarar un valor de metadato `title` para el parámetro de path `item_id` puedes escribir:

{* ../../docs_src/path_params_numeric_validations/tutorial001_an_py310.py hl[10] *}

/// note | Nota

Obtendrás autocompletado en código que podrías considerar imposible antes. Por ejemplo, la clave `price` dentro de un cuerpo JSON (que podría haber estado anidado) que proviene de un request.

No más escribir nombres de claves incorrectos, yendo de un lado a otro entre la documentación, o desplazándote hacia arriba y abajo para encontrar si finalmente usaste `username` o `user_name`.

### Breve

///

## Compartir dependencias `Annotated`

En los ejemplos anteriores, ves que hay un poquito de **duplicación de código**.

Cuando necesitas usar la dependencia `common_parameters()`, tienes que escribir todo el parámetro con la anotación de tipo y `Depends()`:

```Python
commons: Annotated[dict, Depends(common_parameters)]
```

E incluso si no estuvieras usando FastAPI, también podrías escribir tus propias aplicaciones asíncronas con <a href="https://anyio.readthedocs.io/en/stable/" class="external-link" target="_blank">AnyIO</a> para ser altamente compatibles y obtener sus beneficios (p.ej. *concurrencia estructurada*).