Satu proyek. Empat SDK. Diterjemahkan secara serempak.

Frasa yang sama dirender oleh langsys-js-react, langsys-js-vue, langsys-js-svelte — serta SDK dasar vanilla langsys-js-typescript yang mereka bungkus — yang membaca satu proyek Langsys bersama. Ubah locale dan lihat setiap panel diperbarui sekaligus.

Frasa yang sama, tiga idiom — yang berbeda adalah kode di bawah setiap panel. Ubah pesan ke 1 dan setiap binding dirender ulang sekaligus. Kalimatnya ditulis flat: Langsys menghasilkan bentuk jamak setiap lokal selama penerjemahan, sehingga tidak ada yang perlu menulis cabangnya.

const t = useT();
const count = useSignal(countStore);

<p>{t('Hello, {name}!', 'LearnDemo', { name: 'Sarah' })}</p>
<p>{t('You have {count} new messages.', 'LearnDemo', { count })}</p>

const t = useT();
const count = useSignal(countStore);

<p>{{ t('Hello, {name}!', 'LearnDemo', { name: 'Sarah' }) }}</p>
<p>{{ t('You have {count} new messages.', 'LearnDemo', { count }) }}</p>

import { t } from 'langsys-js-svelte';

<p>{$t('Hello, {name}!', 'LearnDemo', { name: 'Sarah' })}</p>
<p>{$t('You have {count} new messages.', 'LearnDemo', { count: $countStore })}</p>

import { t, tSignal } from 'langsys-js-typescript';

tSignal.subscribe(() => {
  hello.textContent = t('Hello, {name}!', 'LearnDemo', { name: 'Sarah' });
  messages.textContent = t('You have {count} new messages.', 'LearnDemo', { count });
});

Jembatan di setiap panel: useSignal (React) · useSignal (Vue) · $store (Svelte — tidak perlu adaptor) · signal.subscribe() (vanilla).

Pilih framework Anda

SDK dasar yang sama di bawahnya — setiap halaman memadukan demo langsung dengan idiom satu binding.

Baru mengenal Langsys? Konsep ini menjelaskan gagasan yang mendasari demo ini — frasa adalah kuncinya, penyimpanan lokal, dan mengapa kunci hanya-baca aman digunakan di browser.