← Konsep

Locale store

Semua yang reaktif di Langsys bertumpu pada satu state kecil: sebuah store yang menyimpan locale saat ini. Atur nilainya, dan setiap terjemahan di dalam tree dirender ulang. Tanpa reload, tanpa perubahan rute.

Satu store menggerakkan semuanya

Anda memberikan sebuah UserLocaleStore kepada LangsysApp.init() — nilai reaktif yang menyimpan string locale. Bentuknya mengikuti apa pun yang disebut reaktif oleh framework Anda: signal Langsys, writable Svelte, atau ref Vue. Tulis ke nilai tersebut dan SDK akan menyelesaikan ulang setiap t(), <Translate>, dan <Phrase> terhadap locale yang baru.

import { LangsysApp, createLocaleStore } from 'langsys-js-react';

const locale = createLocaleStore('en-US');   // one reactive store

await LangsysApp.init({
  projectid,
  key,                    // read-only in the browser
  UserLocaleStore: locale,
});

// Later — anywhere in the app:
locale.set('es-ES');      // every t(), <Translate>, <Phrase> re-renders

Setiap framework membacanya secara native

Mekanisme reaktif berbeda di setiap framework, tetapi modelnya identik — satu sumber kebenaran untuk locale aktif, yang dihadirkan melalui idiom yang sudah Anda gunakan.

// React    — a hook returns the current t, re-rendering on change
const t = useT();

// Vue      — a composable ref, auto-unwrapped in templates
const t = useT();

// Svelte   — a store, auto-subscribed with $
$t('Hello, {name}!', 'Greetings', { name });

Berganti bahasa langsung menerjemahkan ulang di tempat

Saat store berubah, SDK mengambil katalog locale baru — satu permintaan, tanpa memuat ulang halaman — lalu menerjemahkan ulang semuanya begitu katalog tiba. Sampai saat itu, halaman tetap menampilkan bahasa sebelumnya, sehingga tidak ada yang kembali ke teks sumber.

Interpolasi & bentuk jamak

Params mengisi {placeholders}. Kalimat dengan jumlah tetap ditulis datar di kode Anda: Langsys menghasilkan bentuk jamak setiap bahasa saat penerjemahan, dan SDK merender cabang yang sesuai — saat render, dalam locale yang aktif.

t('You have {count} items', 'Cart', { count });

// You write that one flat sentence. Langsys generates each locale's plural
// forms during translation, and the SDK renders the branch your count matches:
// en → "1 item" / "3 items"   ·   es → "1 artículo" / "3 artículos"

Coba langsung: playground interaktif memungkinkan Anda mengedit frasa dan parameter, mengganti lokal, dan melihat SDK sungguhan menerjemahkan ulang.