Ein Projekt. Vier SDKs. Im Gleichschritt übersetzt.

Dieselben Phrasen, gerendert von langsys-js-react, langsys-js-vue, langsys-js-svelte – und dem reinen langsys-js-typescript-Basis-SDK, das sie alle umschließen – lesen ein gemeinsames Langsys-Projekt. Wechseln Sie die Sprache und sehen Sie zu, wie sich alle Bereiche gleichzeitig aktualisieren.

Dieselbe Phrase, drei Idiome – unterschiedlich ist nur der Code unter jedem Panel. Setzen Sie die Nachrichten auf 1, und alle Bindings werden gleichzeitig neu gerendert. Der Satz ist flach geschrieben: Langsys erzeugt die Pluralformen jeder Sprache bei der Übersetzung, sodass niemand die Zweige schreiben muss.

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

Die Brücke in jedem Panel: useSignal (React) · useSignal (Vue) · $store (Svelte – kein Adapter nötig) · signal.subscribe() (Vanilla).

Wählen Sie Ihr Framework

Dasselbe Basis-SDK darunter – jede Seite kombiniert Live-Demos mit den Idiomen einer Anbindung.

Neu bei Langsys? Die Konzepte erklären die Ideen, auf denen diese Demo basiert – die Phrase als Schlüssel, der Locale-Store und warum ein schreibgeschützter Schlüssel im Browser sicher ist.