* **Vue**-Frontend:
    * Mit Vue CLI generiert.
    * Handhabung der **JWT-Authentifizierung**.
    * Login-View.
    * Nach der Anmeldung Hauptansicht des Dashboards.
    * Haupt-Dashboard mit Benutzererstellung und -bearbeitung.
    * Bearbeitung des eigenen Benutzers.
    * **Vuex**.
    * **Vue-Router**.

But in this case, the same **FastAPI** application will handle the API and the authentication.

So, let's review it from that simplified point of view:

* The user types the `username` and `password` in the frontend, and hits `Enter`.

    {!> ../../../docs_src/python_types/tutorial009b.py!}
    ```

#### Using `Union` or `Optional`

If you are using a Python version below 3.10, here's a tip from my very **subjective** point of view:

* 🚨 Avoid using `Optional[SomeType]`
* Instead ✨ **use `Union[SomeType, None]`** ✨.

* **Uvicorn**:
    * Bietet die beste Leistung, da außer dem Server selbst nicht viel zusätzlicher Code vorhanden ist.

# Über HTTPS

Es ist leicht anzunehmen, dass HTTPS etwas ist, was einfach nur „aktiviert“ wird oder nicht.

Aber es ist viel komplexer als das.

!!! tip "Tipp"
    Wenn Sie es eilig haben oder es Ihnen egal ist, fahren Sie mit den nächsten Abschnitten fort, um Schritt-für-Schritt-Anleitungen für die Einrichtung der verschiedenen Technologien zu erhalten.

    All dies scheint angesichts dieser einfachen Beispiele möglicherweise nicht so nützlich zu sein.

    Aber Sie werden in den Kapiteln über **Sicherheit** sehen, wie nützlich das ist.

    When writing the code to document a callback, it might be useful to imagine that you are that *external developer*. And that you are currently implementing the *external API*, not *your API*.

    Temporarily adopting this point of view (of the *external developer*) can help you feel like it's more obvious where to put the parameters, the Pydantic model for the body, for the response, etc. for that *external API*.

### Create a callback `APIRouter`

* If the PR can be simplified in a way, you can ask for that, but there's no need to be too picky, there might be a lot of subjective points of view (and I will have my own as well 🙈), so it's better if you can focus on the fundamental things.

### Tests

* Help me check that the PR has **tests**.

* Check that the tests **fail** before the PR. 🚨

Nehmen wir zum Beispiel an, Sie haben vier API-Endpunkte (*Pfadoperationen*):

* `/items/public/`
* `/items/private/`
* `/users/{user_id}/activate`
* `/items/pro/`

Et pourtant l'expérience finale n'est pas meilleure 😞.

---

C'est donc l'histoire équivalente parallèle pour les burgers 🍔.

Pour un exemple plus courant dans la "vie réelle", imaginez une banque.

Jusqu'à récemment, la plupart des banques avaient plusieurs caisses (et banquiers) 👨‍💼👨‍💼👨‍💼👨‍💼 et une unique file d'attente 🕙🕙🕙🕙🕙🕙🕙🕙.