Şablonlar¶

uvx library-skills

FastAPI ile istediğiniz herhangi bir template engine'i kullanabilirsiniz.

Yaygın bir tercih, Flask ve diğer araçların da kullandığı Jinja2'dir.

Bunu kolayca yapılandırmak için, doğrudan FastAPI uygulamanızda kullanabileceğiniz yardımcı araçlar vardır (Starlette tarafından sağlanır).

Bağımlılıkları Yükleme¶

Projenize jinja2 ekleyin:

$ uv add jinja2

---> 100%

Jinja2Templates Kullanımı¶

• Jinja2Templates'ı içe aktarın.
• Daha sonra tekrar kullanabileceğiniz bir templates nesnesi oluşturun.
• Template döndürecek path operation içinde bir Request parametresi tanımlayın.
• Oluşturduğunuz templates nesnesini kullanarak bir TemplateResponse render edip döndürün; template'in adını, request nesnesini ve Jinja2 template'i içinde kullanılacak anahtar-değer çiftlerini içeren bir "context" sözlüğünü (dict) iletin.

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):
    return templates.TemplateResponse(
        request=request, name="item.html", context={"id": id}
    )

Template Yazma¶

Ardından örneğin templates/item.html konumunda bir template yazabilirsiniz:

<html>
<head>
    <title>Item Details</title>
    <link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">
</head>
<body>
    <h1><a href="{{ url_for('read_item', id=id) }}">Item ID: {{ id }}</a></h1>
</body>
</html>

Template Context Değerleri¶

Şu HTML içeriğinde:

Item ID: {{ id }}

...gösterilecek olan id, sizin "context" olarak ilettiğiniz dict içinden alınır:

{"id": id}

Örneğin ID değeri 42 ise, şu şekilde render edilir:

Item ID: 42

Template url_for Argümanları¶

Template içinde url_for() da kullanabilirsiniz; argüman olarak, path operation function'ınızın kullandığı argümanların aynısını alır.

Dolayısıyla şu bölüm:

<a href="{{ url_for('read_item', id=id) }}">

...path operation function olan read_item(id=id) tarafından handle edilecek URL'nin aynısına bir link üretir.

url_for(), mevcut request'e göre şema ve host'u da içeren mutlak bir URL döndürür.

Örneğin uygulamanız https://example.com adresinde sunuluyorsa ve ID değeri 42 ise, şu şekilde render edilir:

<a href="https://example.com/items/42">

Template'lerde URL Path'leri¶

Aynı siteye verilen linklerde yalnızca URL path'ini almak için .path niteliğini kullanabilirsiniz. Örneğin, templates/item_path.html içinde:

<html>
<head>
    <title>Item Details</title>
    <link href="{{ url_for('static', path='/styles.css').path }}" rel="stylesheet">
</head>
<body>
    <h1><a href="{{ url_for('read_item', id=id).path }}">Item ID: {{ id }}</a></h1>
</body>
</html>

Template'in adını TemplateResponse'a iletin:

# Code above omitted 👆

@app.get("/items/{id}", response_class=HTMLResponse)
async def read_item(request: Request, id: str):
    return templates.TemplateResponse(
        request=request, name="item_path.html", context={"id": id}
    )

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):
    return templates.TemplateResponse(
        request=request, name="item_path.html", context={"id": id}
    )

Aynı örnekte, öğenin linki şu şekilde render edilir:

<a href="/items/42">

Baştaki /, bu path'i mevcut sitenin köküne göre göreli hale getirir.

.path niteliği şemayı, host'u, query parametrelerini ve fragment'ı içermez. Başka bir host'a verilen linklerde tam URL'yi kullanın.

Template'ler ve statik dosyalar¶

Template içinde url_for() kullanabilir ve örneğin name="static" ile mount ettiğiniz StaticFiles ile birlikte kullanabilirsiniz.

<html>
<head>
    <title>Item Details</title>
    <link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">
</head>
<body>
    <h1><a href="{{ url_for('read_item', id=id) }}">Item ID: {{ id }}</a></h1>
</body>
</html>

Bu örnekte, şu şekilde static/styles.css konumundaki bir CSS dosyasına link verir:

h1 {
    color: green;
}

Ve StaticFiles kullandığınız için, bu CSS dosyası FastAPI uygulamanız tarafından /static/styles.css URL'sinde otomatik olarak servis edilir.

Daha fazla detay¶

Template'leri nasıl test edeceğiniz dahil daha fazla detay için Starlette'in template dokümantasyonuna bakın.