From 75737c19da4b6b4e1e823b7a18cbbbc5d023c3c3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebasti=C3=A1n=20Ram=C3=ADrez?= Date: Wed, 1 Jul 2026 12:37:00 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=8C=90=20Update=20translations=20for=20tr?= =?UTF-8?q?=20(add-missing)=20(#15887)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: github-actions[bot] --- docs/tr/docs/tutorial/frontend.md | 133 ++++++++++++++++++++++++++++++ 1 file changed, 133 insertions(+) create mode 100644 docs/tr/docs/tutorial/frontend.md diff --git a/docs/tr/docs/tutorial/frontend.md b/docs/tr/docs/tutorial/frontend.md new file mode 100644 index 0000000000..7918ca593e --- /dev/null +++ b/docs/tr/docs/tutorial/frontend.md @@ -0,0 +1,133 @@ +# Frontend { #frontend } + +Statik frontend uygulamalarını `app.frontend()` (veya `router.frontend()`) ile sunabilirsiniz. + +Bu, Vite ile React, TanStack Router, Astro, Vue, Svelte, Angular, Solid ve benzeri statik dosyalar üreten frontend araçları için kullanışlıdır. + +Bu araçlarda genellikle frontend'i build eden bir adım olur, örneğin şöyle bir komutla: + +```bash +npm run build +``` + +Bu komut, frontend dosyalarınızla birlikte `./dist/` gibi bir dizin oluşturur. + +Bu dizini, frontend framework'lerinin ihtiyaç duyduğu kurallara uygun şekilde sunmak için `app.frontend()` kullanabilirsiniz. + +**FastAPI** önce *path operation*'ları kontrol eder. Frontend dosyaları yalnızca hiçbir normal route eşleşmezse kontrol edilir, bu yüzden API'niz bundan etkilenmez. + +## Frontend Sunma { #serve-a-frontend } + +Frontend'inizi build ettikten sonra, örneğin `npm run build` ile, oluşturulan dosyaları bir dizine koyun; örneğin `dist`. + +Proje yapınız şöyle görünebilir: + +```text +. +├── pyproject.toml +├── app +│ ├── __init__.py +│ └── main.py +└── dist + ├── index.html + └── assets + └── app.js +``` + +Ardından bunu `app.frontend()` ile sunun: + +{* ../../docs_src/frontend/tutorial001_py310.py hl[5] *} + +Böylece `/assets/app.js` için gelen bir request, `dist/assets/app.js` dosyasını sunabilir. + +Aynı zamanda bir **FastAPI** *path operation*'ınız varsa, öncelik *path operation*'dadır. + +## Client-Side Routing { #client-side-routing } + +**Single-page app**'ler (SPA'ler) dahil birçok frontend uygulaması client-side routing kullanır. `/dashboard/settings` gibi bir path gerçek bir dosya olmayabilir; bunu frontend framework'ü ele alır. + +Bu yüzden, o URL'ye doğrudan erişildiğinde (uygulama içinde gezinmek yerine), backend frontend uygulamasını `index.html` üzerinden sunmalıdır. Böylece frontend framework'ü client-side routing'i işleyebilir. + +Bunun için `fallback="index.html"` kullanın: + +{* ../../docs_src/frontend/tutorial002_py310.py hl[5] *} + +**FastAPI** bu fallback'i yalnızca tarayıcı gezinmesi gibi görünen `GET` ve `HEAD` request'leri için kullanır. JavaScript, CSS ve görseller gibi eksik dosyalar yine `404` döndürür. + +`POST` veya `PUT` gibi diğer metotlarla, yalnızca frontend fallback'i ile eşleşen path'lere yapılan request'ler de `404` döndürür. Normal **FastAPI** *path operation*'ları frontend route'larından yine daha yüksek önceliğe sahiptir. + +/// tip | İpucu + +Varsayılan olarak `fallback`, `fallback="auto"` değerine sahiptir. Çoğu durumda `fallback` belirtmeniz gerekmez. Detaylar için aşağıyı okuyun. + +/// + +Client-side routing kullanan birçok frontend uygulamasında istediğiniz davranış budur; örneğin TanStack Router ile React, Vue, Angular, SvelteKit veya Solid. + +## Özel 404 Sayfası { #custom-404-page } + +Bulunamayan frontend path'leri için statik bir `404.html` sayfası da sunabilirsiniz: + +{* ../../docs_src/frontend/tutorial003_py310.py hl[5] *} + +Bu response, `404` status code'unu korur. + +Bu durumda **FastAPI**, bulunamayan frontend path'leri için `index.html` sunmaz. Bunun yerine `404.html` dosyasını döndürür. + +/// tip | İpucu + +Varsayılan olarak `fallback`, `fallback="auto"` değerine sahiptir. Bu durumda bir `404.html` dosyası bulunursa, otomatik olarak fallback olarak kullanılır. + +Bu yüzden normalde `fallback` argümanını atlayabilirsiniz. + +/// + +Bu, Astro gibi her sayfa için statik HTML dosyaları üreten frontend araçlarıyla kullanışlıdır. + +## Otomatik Fallback { #fallback-auto } + +Varsayılan olarak `app.frontend()`, `fallback="auto"` kullanır. + +Frontend dizininde bir `404.html` dosyası varsa, bulunamayan frontend path'leri bu dosyayı `404` status code'u ile sunar. + +Aksi halde bir `index.html` dosyası varsa, bulunamayan tarayıcı gezinme path'leri `index.html` sunar. Client-side routing kullanan birçok frontend uygulamasının beklediği davranış budur. + +Bu yüzden çoğu durumda `fallback` argümanını belirtmeden `app.frontend("/", directory="dist")` kullanabilirsiniz. + +{* ../../docs_src/frontend/tutorial001_py310.py hl[5] *} + +## Fallback'i Devre Dışı Bırakma { #disable-fallback } + +Bulunamayan frontend path'leri için fallback dosyası sunmak istemiyorsanız `fallback=None` kullanın: + +{* ../../docs_src/frontend/tutorial005_py310.py hl[5] *} + +Bundan sonra bulunamayan frontend path'leri normal `404` döndürür. + +## Dizini Kontrol Etme { #check-directory } + +Varsayılan olarak `app.frontend()`, uygulama oluşturulduğunda dizinin var olduğunu kontrol eder. + +Bu, yapılandırma hatalarını erken yakalamaya yardımcı olur. Örneğin frontend build çıktısı dizini yoksa, **FastAPI** başlangıçta hata verir. + +Frontend dosyalarınız daha sonra oluşturuluyorsa, örneğin app nesnesi oluşturulduktan sonra ayrı bir build adımıyla, `check_dir=False` ayarlayın: + +{* ../../docs_src/frontend/tutorial006_py310.py hl[5] *} + +`check_dir=False` ile **FastAPI**, app oluşturulduğunda dizini kontrol etmez. Yapılandırılan dizin bir request işlendiği sırada hâlâ yoksa, **FastAPI** o zaman hata verir. + +## `APIRouter` ile Kullanma { #use-it-with-apirouter } + +Frontend dosyalarını bir `APIRouter`'a da ekleyebilir ve bunu bir prefix ile dahil edebilirsiniz: + +{* ../../docs_src/frontend/tutorial004_py310.py hl[6,7] *} + +Bu örnekte frontend path'leri `/app` altında sunulur. + +Uygulamadaki herhangi bir normal *path operation*, diğer router'larda olanlar dahil, yine öncelikli olur. + +## Yalnızca Statik Build Çıktısı { #static-build-output-only } + +`app.frontend()`, frontend build'iniz tarafından önceden oluşturulmuş dosyaları sunar. + +Server-side rendering çalıştırmaz. Her request için server'da dinamik rendering gerektiren framework'ler için değil, statik dosyalar üreten frontend framework'leri içindir.