Next.js Uluslararasılaştırma Özellikler

Çok dilli Next.js uygulamaları oluşturmak için ihtiyacın olan her şey. CDN destekli çeviriler, sunucu tarafı render ve anında dil değiştirme.

Başla Dashboard'u Aç

CDN Destekli Dağıtım

Çeviriler, Cloudflare CDN aracılığıyla dünya genelindeki edge konumlarından sunulur. Yayınlamada otomatik önbellek geçersiz kılma ile 50 ms altı yükleme süreleri.

CDN dağıtımı hakkında bilgi al

Sunucu Tarafı Render (SSR)

Mesajlar, getMessages() kullanılarak layout'unda sunucu tarafında yüklenir. Çevirilmemiş içerik titremesi yok, önceden render edilmiş çevirilerle tam SEO uyumlu.

API referansını görüntüle

Anında Yerel Dil Değiştirme

useSetLocale() ile tam sayfa yeniden yükleme olmadan dilleri istemci tarafında değiştir. BetterI18nProvider yeni çevirileri CDN'den alır ve anında yeniden render eder.

İstemci tarafı dokümanları

Dinamik Dil Keşfi

useManifestLanguages(), CDN manifestinden mevcut dilleri çeker. Dashboard'a bir dil ekle ve uygulamanızda otomatik olarak görünsün.

Hook'ları keşfet

Tip Güvenli Çeviri Anahtarları

Tam TypeScript desteğiyle next-intl üzerine inşa edilmiştir. useTranslations(), çeviri anahtarları için derleme zamanı denetimi sağlar — hataları runtime'ın öncesinde yakala.

Tip güvenli API dokümanları

Yapay Zeka Destekli Çeviri

better-i18n dashboard'unda yapay zeka çeviri önerileri al. İnsan onayı iş akışı kaliteyi güvence altına alır. Tüm projeleri günler değil dakikalar içinde çevir.

Dashboard'u dene

Middleware Yerel Dil Algılama

betterMiddleware(), URL yolu, çerez veya Accept-Language başlığından kullanıcı dilini algılar. Kolay kimlik doğrulama entegrasyonu için Clerk tarzı callback deseni.

Middleware kurulum kılavuzu

Dashboard Yönetimi

dash.better-i18n.com'üzerinden çevirileri, dilleri ve namespace'leri yönet. Gerçek zamanlı iş birliği, sürüm geçmişi ve GitHub entegrasyonu.

Dashboard'u aç

Entegrasyon Adımları

4 basit adımda hazır olun.

Kur

SDK’yı projenize ekleyin

bun add @better-i18n/next

Yapılandır

i18n yapılandırmanızı oluşturun

export const i18n = createI18n({ ... })

Provider Sar

BetterI18nProvider’ı layout’unuza ekleyin

<BetterI18nProvider>

Çevirileri Kullan

Herhangi bir component’te useTranslations() çağırın

const t = useTranslations("ns")

Framework Uyumluluğu

better-i18n tüm önemli React framework’leriyle kutudan çıktığı gibi çalışır.

Feature	Next.js	Expo	Remix	Hono	TanStack
CDN Fetch	✓	✓	✓	✓	✓
ISR / Revalidation	✓	—	✓	—	✓
useSetLocale()	✓	✓	✓	✓	✓
useFormatter()	✓	✓	✓	✓	✓
LocaleDropdown	✓	✓	✓	✓	✓
SSR Support	✓	—	✓	✓	✓

Hızlı Entegrasyon

Next.js uygulamana 5 dakikadan kısa sürede uluslararasılaştırma ekle. Tam kılavuzu takip et

i18n.config.ts

// i18n.config.ts
import { createI18n } from "@better-i18n/next";

export const i18n = createI18n({
  project: "your-org/your-project",
  defaultLocale: "en",
});

// middleware.ts
import { i18n } from "./i18n.config";
export default i18n.betterMiddleware();

// app/[locale]/layout.tsx
const messages = await i18n.getMessages(locale);
<BetterI18nProvider config={i18n.config} locale={locale} messages={messages}>
  {children}
</BetterI18nProvider>

// Any component
const t = useTranslations("namespace");
return <h1>{t("title")}</h1>;

Çok dilli olmaya hazır mısın?

Ücretsiz bir hesap oluştur, dillerini ekle ve çevirmeye başla. Küresel kitleye yönelik uygulama geliştiren binlerce geliştiriciye katıl.

Dokümantasyonu Oku Dashboard'u Aç

Yükleniyor...

Feature

Next.js

Expo

Remix

Hono

TanStack

CDN Fetch

✓

ISR / Revalidation

✓

—

✓

—

✓

useSetLocale()

✓

useFormatter()

✓

LocaleDropdown

✓

SSR Support

✓

—

✓

// i18n.config.ts import { createI18n } from "@better-i18n/next"; export const i18n = createI18n({ project: "your-org/your-project", defaultLocale: "en", }); // middleware.ts import { i18n } from "./i18n.config"; export default i18n.betterMiddleware(); // app/[locale]/layout.tsx const messages = await i18n.getMessages(locale); <BetterI18nProvider config={i18n.config} locale={locale} messages={messages}> {children} </BetterI18nProvider> // Any component const t = useTranslations("namespace"); return <h1>{t("title")}</h1>;