from fastapi import FastAPI, Request
from fastapi.responses import HTMLResponse
from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates

app = FastAPI()

app.mount("/static", StaticFiles(directory="static"), name="static")


templates = Jinja2Templates(directory="templates")


@app.get("/items/{id}", response_class=HTMLResponse)
async def read_item(request: Request, id: str):

## Использование `StaticFiles` { #use-staticfiles }

* Импортируйте `StaticFiles`.
* "Примонтируйте" экземпляр `StaticFiles()` к определённому пути.

{* ../../docs_src/static_files/tutorial001_py39.py hl[2,6] *}

/// note | Технические детали

Вы также можете использовать `from starlette.staticfiles import StaticFiles`.

Mit `StaticFiles` können Sie statische Dateien aus einem Verzeichnis automatisch bereitstellen.

## `StaticFiles` verwenden { #use-staticfiles }

* Importieren Sie `StaticFiles`.
* „Mounten“ Sie eine `StaticFiles()`-Instanz in einem bestimmten Pfad.

{* ../../docs_src/static_files/tutorial001_py39.py hl[2,6] *}

/// note | Technische Details

Sie könnten auch `from starlette.staticfiles import StaticFiles` verwenden.

## Use `StaticFiles` { #use-staticfiles }

* Import `StaticFiles`.
* "Mount" a `StaticFiles()` instance in a specific path.

{* ../../docs_src/static_files/tutorial001_py39.py hl[2,6] *}

/// note | Technical Details

You could also use `from starlette.staticfiles import StaticFiles`.

Puedes servir archivos estáticos automáticamente desde un directorio utilizando `StaticFiles`.

## Usa `StaticFiles` { #use-staticfiles }

* Importa `StaticFiles`.
* "Monta" una instance de `StaticFiles()` en un path específico.

{* ../../docs_src/static_files/tutorial001_py39.py hl[2,6] *}

/// note | Detalles Técnicos

También podrías usar `from starlette.staticfiles import StaticFiles`.

from fastapi import FastAPI
from fastapi.staticfiles import StaticFiles

app = FastAPI()

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

Neste exemplo, ele seria vinculado a um arquivo CSS em `static/styles.css` com:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

**FastAPI** bietet dasselbe `starlette.templating` auch via `fastapi.templating` an, als Annehmlichkeit für Sie, den Entwickler. Aber die meisten der verfügbaren Responses kommen direkt von Starlette. Das Gleiche gilt für `Request` und `StaticFiles`.

///

## Templates erstellen { #writing-templates }

Dann können Sie unter `templates/item.html` ein Template erstellen, mit z. B. folgendem Inhalt:

```jinja hl_lines="7"

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

In this example, it would link to a CSS file at `static/styles.css` with:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

    ├── redoc.standalone.js
    ├── swagger-ui-bundle.js
    └── swagger-ui.css
```

### Предоставьте доступ к статическим файлам { #serve-the-static-files }

* Импортируйте `StaticFiles`.
* Смонтируйте экземпляр `StaticFiles()` в определённый путь.

{* ../../docs_src/custom_docs_ui/tutorial002_py39.py hl[7,11] *}

### Протестируйте статические файлы { #test-the-static-files }