Langsys Learning Center
For the developer wiring Langsys into an app. Realtime, continuous localization — the phrase in your code is the key and the default; no keys file, no extraction step. Watch the explainer, read the five concepts, set up a project, then pick your stack.
The path
Three stops, in this order. The SDK pages assume the first two.
Concepts
The ideas behind Langsys — the phrase is the key, token discovery, the locale store, keys, and adding a locale. Five short pages, each with its video.
Step 2 · 2 minQuickstart
Create a project, mint a write key and a read-only key, wire them into your env.
Step 3Pick your stack
Six SDKs, one surface. Each page starts at Install and pairs live demos with the idioms of that binding.
Frontend — JavaScript
One base SDK does the work; each framework binding is a thin wrapper over it.
TypeScript
The framework-agnostic base SDK — langsys-js-typescript. Every binding wraps this.
React
Hooks and components — langsys-js-react.
Vue
Composables and components — langsys-js-vue.
Svelte
Stores and components — langsys-js-svelte. The page with a demo cut per primitive.
Backend — server-rendered
Your templates translate on the server, so the page arrives already localized.
PHP
The base SDK — langsys/langsys-php. Any PHP app: plain PHP, a framework, a worker or a CLI.
Laravel
The @t Blade directive and t() helper — langsys/langsys-php-laravel.
Guides — server-side rendering
Each guide follows one pattern — fetch the catalog on the server, initialize the client binding from it — so the catalog is fetched once and the server key stays on the server.
Next.js
App Router — Server Component fetch, 'use client' init.
Nuxt
Nitro route + useAsyncData seeding the Vue binding.
SvelteKit
+layout.server.ts load, standard writable as the locale store.
See it, fix it
Side by side
React, Vue, Svelte, and vanilla TypeScript translating in lockstep from one shared project.
The dashboard
The Translation Manager with no code on screen: review, memory, organizations, credits and billing.
Videos
Every demo cut in one place — the concepts track, Svelte API by API, and the Translation Manager.
Troubleshooting
Phrases that won't translate, CORS blocks, silent read-only misses — symptoms and fixes.
Looking for the API reference and integration guides? Head to the Langsys docs.