i18n ve react-i18next

useTranslation ile çok dilli arayüz yazmayı öğrenirsin.

i18n ve react-i18next

Uluslararasılaştırma (i18n), uygulamayı birden çok dile hazırlamaktır. React'te en yaygın kütüphane react-i18next'tir. useTranslation hook'u bir t fonksiyonu döndürür; t('merhaba') ile o anki dilde metni alırsın.

Dil dosyaları JSON biçiminde tutulur. i18n.changeLanguage('en') ile dil değiştirilir; bileşenler otomatik yeniden çizilir.

Tarih, sayı ve para için Intl API'sini kullanırsın; kendin biçim yazmazsın.

Çoğullar ve değişkenler

i18next çoğul biçimleri otomatik çözer: t('elma', { count: 3 }) çağrısı çoğul anahtarı döndürür. Değişken yerleştirme {{ name }} sözdizimiyle yapılır.

Bir anahtar eksikse geri dönüş dili kullanılır. Böylece yeni dil eklerken uygulama kırılmaz.

Tarihleri Intl.DateTimeFormat ile, para birimini Intl.NumberFormat ile yerelleştirirsin.

Uygulama Greeting bileşenini yaz

Greeting bileşeni yaz. useTranslation ile t al, <h1>{t('merhaba', { name: 'Ayşe' })}</h1> döndür. Dışa aktar.

Örnek çözümü göster

import { useTranslation } from 'react-i18next';

function Greeting() {
  const { t } = useTranslation();
  return <h1>{t('merhaba', { name: 'Ayşe' })}</h1>;
}
export default Greeting;

Kendini test et

i18n kavramlarını eşleştir

useTranslation

t fonksiyonu verir
changeLanguage

Dili değiştirir
Intl

Tarih ve sayı biçimler
fallback

Eksik anahtarı karşılar
i18next'te eksik bir anahtar ne yapar?
- Uygulama çöker
- Boş dize döndürür ve uyarı vermez
- Geri dönüş dilindeki karşılığını döndürür
- Anahtarı dosyaya otomatik ekler
Cevabı göster

Geri dönüş dilindeki karşılığını döndürür — Geri dönüş dili kullanılır.

Boşluğu doldur: sayıyı para olarak biçimle

const fiyat = new Intl.NumberFormat('tr', { style: '____', currency: 'TRY' }).format(120);

Cevabı göster

const fiyat = new Intl.NumberFormat('tr', { style: 'currency', currency: 'TRY' }).format(120);

Sıradaki ders: Özet - Erişilebilirlik ve i18n

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler