Çoklu Dil Kullanımı

İ18n Nedir?

i18n (internationalization), sitenin birden fazla dilde çalışmasını sağlar. Falcon’da:

• İngilizce (EN) varsayılan dil — URL’de önek yok: /, /blog/welcome/
• Diğer diller — locale öneki ile: /tr/, /tr/blog/hos-geldiniz/, /de/blog/, /fr/blog/

Aynı “sayfa” farklı dillerde farklı URL ve farklı metinle sunulur. Blog yazıları da dil başına ayrılır.

---

Neden Kurduk?

• Kurumsal site TR, DE, FR (ve ileride başka diller) ile yayınlanacak
• EN slug’ları İngilizce, TR slug’ları Türkçe olabilir (ör. /contact ↔ /tr/iletisim — sitePages.contact, Sayfa Ekle / Kaldır)
• Blog yazılarının çevirisi ayrı MDX dosyası olarak durur
• Metinler kodda dağınık string olmaz; t() ve routes.ts ile merkezi yönetilir

İçerik src/content/blog/ altındaki MDX dosyalarında; harici CMS yok.

---

Nasıl Kuruldu?

1. Astro İ18n (astro.config.mjs)

i18n: {
  defaultLocale: 'en',
  locales: ['en', 'tr', 'de', 'fr'],
  routing: { prefixDefaultLocale: false },
}

prefixDefaultLocale: false → EN için /tr gibi önek yok.

2. Dil Config (src/config/locales.ts)

• locales — desteklenen diller
• prefixedLocales — URL’de önek alanlar (tr, de, fr)
• localeMap — HTML lang ve tarih formatı (tr-TR vb.)

3. URL Haritası (src/config/routes.ts)

Her mantıksal sayfa bir pageId ile tanımlanır; her dilin path’i burada:

sitePages.blog.tr  // → '/tr/blog'
sitePages.home.de  // → '/de/'

Yeni sayfa eklerken önce sitePages’e satır ekle, sonra ilgili src/pages/ dosyalarını oluştur.

4. Metinler (src/i18n/)

• types.ts — LS = { en, tr, de, fr }
• utils.ts — getLangFromUrl(), t(), ls()
• common.ts — Blog, Home, Back gibi UI metinleri

Örnek:

t(common.nav.blog, locale)  // locale'e göre doğru metin
ls('Blog', 'Blog', 'Blog', 'Blog')  // 4 dilde string

5. Blog İçeriği

Tek koleksiyon: blog. Dil ayrımı frontmatter locale ile:

---
title: ...
locale: tr
---

Dosyalar src/content/blog/ altında (klasör değil, alan ile ayrım).

6. Sayfa Yapısı (Mirror)

Dil	Ana sayfa	Blog liste	Blog yazı
EN	src/pages/index.astro	src/pages/blog/	src/pages/blog/[...slug].astro
TR	src/pages/tr/index.astro	src/pages/tr/blog/	src/pages/tr/blog/[...slug].astro
DE/FR	src/pages/de/index.astro, fr/index.astro	src/pages/de/blog/ …	aynı kalıp

Ortak mantık: src/lib/blog.ts (getPostsForLocale, getBlogPostPath, createBlogPostStaticPaths).

---

Blog URL’leri

Dil	Liste	Örnek
EN	/blog/	/blog/welcome/
TR	/tr/blog/	/tr/blog/hos-geldiniz/
DE	/de/blog/	(yazı eklenince)
FR	/fr/blog/	(yazı eklenince)

• welcome.mdx → locale: en → yalnızca /blog/welcome/
• hos-geldiniz.mdx → locale: tr → yalnızca /tr/blog/hos-geldiniz/
• /blog/hos-geldiniz/ gibi yanlış dil + slug → sayfa üretilmez (404)

Path üretimi: getBlogPostPath(locale, post.id) veya sitePages.blog[locale] — sayfada hardcode URL yazma.

---

Nasıl Kullanılır?

Yeni Blog Yazısı (Türkçe)

1. src/content/blog/yazi-slug.mdx oluştur
2. Frontmatter: title, description, pubDate, locale: tr
3. Build → otomatik /tr/blog/yazi-slug/

Almanca/Fransızca için locale: de veya fr; ilgili src/pages/de/blog/ rotaları zaten var.

Yeni Site Sayfası (Ör. İletişim)

1. src/config/routes.ts → sitePages.contact tüm diller için:

   contact: {
     en: '/contact',
     tr: '/tr/iletisim',
     de: '/de/kontakt',
     fr: '/fr/contact',
   }

2. Sayfa dosyaları: src/pages/contact.astro, src/pages/tr/iletisim.astro …

3. Metinler: src/i18n/ içinde ls() / t()

4. LanguageSwitcher pageId="contact" (sayfa eklenince)

Sayfada Dil Algılama

---
import { getLangFromUrl } from '@/i18n/utils';
const locale = getLangFromUrl(Astro.url);
---

Mirror sayfalarda (tr/index.astro) locale = 'tr' sabit de olabilir; dinamik bileşenlerde URL’den okumak daha güvenli.

Dil Değiştirici

<LanguageSwitcher pageId="home" /> veya pageId="blog" — linkler sitePages[pageId][locale] üzerinden gelir.

Not: Blog yazısındayken dil değiştirici, translationKey ile eşleşen karşılık yazıya gidebilir (welcome ↔ hos-geldiniz); anahtar yoksa aynı dilin blog listesine döner.

---

Nelere Dikkat Et?

Yap	Yapma
URL’leri sitePages ve getBlogPostPath ile üret	/tr/blog/ string’ini sayfaya yapıştır
Her MDX’e doğru locale yaz	locale olmadan blog ekleme
Yeni dil sayfası → routes.ts + pages/	Sadece TR klasörü açıp config unutma
UI metni → t(common....)	Her sayfada ayrı “Blog” yazısı
EN içerik önek siz	/en/blog kullanma

İsteğe bağlı iyileştirmeler:

• Uzun yazı gövdesi için prose / .fix-prose — MDX Kullanımı Ve Blog URL
• fix-badge ve benzeri Fix UI parçaları — Fix UI Kullanımı

---

Dosya Özeti

src/config/locales.ts    → diller
src/config/routes.ts     → URL haritası
src/i18n/                → metinler ve t()
src/lib/blog.ts          → blog filtre + path
src/content/blog/*.mdx   → locale alanı
src/pages/               → EN
src/pages/tr/            → TR mirror
src/components/i18n/LanguageSwitcher.astro

---

Doğrulama

npm run build

Tarayıcıda: /, /tr/, /blog/, /blog/welcome/, /tr/blog/, /tr/blog/hos-geldiniz/ → 200.

---

Özet

EN öneksiz, diğer diller /tr/, /de/, /fr/ ile. URL’ler routes.ts, metinler i18n/, blog dili locale frontmatter. Yeni içerik = MDX + doğru locale; yeni sayfa = sitePages + mirror pages.