Jeden projekt. Cztery pakiety SDK. Tłumaczone synchronicznie.

Te same frazy renderowane przez langsys-js-react, langsys-js-vue, langsys-js-svelte — oraz podstawowe SDK langsys-js-typescript bez frameworka, które wszystkie je opakowują — odczytujące jeden wspólny projekt Langsys. Zmień ustawienia regionalne i zobacz, jak wszystkie panele aktualizują się jednocześnie.

Ta sama fraza, trzy idiomy — różni się kod pod każdym panelem. Ustaw komunikaty na 1, a wszystkie powiązania wyrenderują się ponownie naraz. Zdanie jest zapisane płasko: Langsys generuje formy liczby mnogiej dla każdego języka podczas tłumaczenia, więc nikt nie pisze gałęzi.

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 });
});

Pomost w każdym panelu: useSignal (React) · useSignal (Vue) · $store (Svelte — adapter niepotrzebny) · signal.subscribe() (czysty JS).

Wybierz swój framework

Pod spodem to samo bazowe SDK — każda strona łączy demonstracje na żywo z idiomami jednego powiązania.

Nowy w Langsys? Koncepcje wyjaśniają założenia, na których działa to demo — fraza jako klucz, magazyn ustawień regionalnych i dlaczego klucz tylko do odczytu jest bezpieczny w przeglądarce.