REST API
React + i18next
Den fullstendige API-referansen vil auto-genereres fra vår OpenAPI 3.1-spec i det surface er stabil. Vi shipper heller en placeholder enn å fake-doke endepunkter som fortsatt kan flytte seg. I mellomtiden, her er formen, hva den vil dekke og hva du gjør i dag.
Installer
Krever <strong>Node 20 LTS</strong> eller nyere. To binærer installeres: <code>verbumia</code> og det kortere aliaset <code>vrb</code> — utbyttbare.
terminal 1npm i @verbumia/react-i18next 2. Pakk inn appen
VerbumiaProvider tar en projectId og en apiKey. Alt annet har fornuftige defaults: locale auto-detekteres fra nettleseren, namespaces lastes lazy fra ditt CDN, missing-key-handler debounces og POSTes automatisk.
main.tsx 1// src/main.tsx2import { VerbumiaProvider } from "@verbumia/react-i18next";3import { createRoot } from "react-dom/client";4import { App } from "./App"; 6createRoot(document.getElementById("root")!).render(7 <VerbumiaProvider8 projectId="proj_xxx"9 apiKey={import.meta.env.VITE_VERBUMIA_KEY}10 defaultLocale="en"11 namespaces={["common"]}12 >13 <App />14 </VerbumiaProvider>15); Alle VerbumiaProvider-props
| Prop | Type | Default |
|---|---|---|
| projectId | string | — påkrevd |
| apiKey | string | — påkrevd |
| defaultLocale | string | browser |
| defaultNS | string | "common" |
| namespaces | string[] | ["common"] |
| cdnUrl | string | cdn.verbumia.ca |
| baseUrl | string | api.verbumia.ca |
| missingHandlerEndpoint | string | /v1/missing |
| debounceMs | number | 5000 |
| transport | (batch) => void | Promise<void> | internal |
3. Bruk hooken
useTranslation() returnerer { t, i18n }. Kjent form hvis du har brukt react-i18next. i18n.ready sier når initielle namespaces er hydrert; i18n.changeLanguage() bytter locale i runtime.
Checkout.tsx 1// src/Checkout.tsx2import { useTranslation } from "@verbumia/react-i18next"; 4export function Checkout() {5 const { t, i18n } = useTranslation("common"); 7 if (!i18n.ready) return null; // first paint after hydration 9 return (10 <button onClick={() => i18n.changeLanguage("fr")}>11 {t("checkout.review.confirm")}12 </button>13 );14} Det du får gratis
- Fangst av manglende nøkler. Hver nøkkel du kaller som ikke finnes i ordboken køes, debounces (5s default) og POSTes til dashbordets missing-kø. Produksjonssikkert — fallbacken din rendres fortsatt.
- Namespaces via CDN. Oversettelsesbunter hentes fra
cdn.verbumia.camed HTTP-caching og stale-while-revalidate. Ingen build-time-bundling kreves. - Auto-detektert locale. Hvis du ikke sender
defaultLocale, leser SDK-ennavigator.languageog faller tilbake på prosjektets default. - Åpne eksporter. Alt du pusher til Verbumia kan du eksportere tilbake til JSON i18next, XLIFF eller PO. Bytt verktøy i morgen uten å skrive om koden.
Egen transport (avansert)
Må du logge manglende nøkler til din egen observability-stack, gate dem bak din auth, eller stubbe dem ut i tester? Send inn en transport-funksjon. SDK-en debouncer og batcher fortsatt; du bestemmer hva som skjer med batchen.
main.tsx 1// custom transport — useful for tests, edge cases, or auditing2<VerbumiaProvider3 projectId="proj_xxx"4 apiKey={import.meta.env.VITE_VERBUMIA_KEY}5 debounceMs={2000}6 transport={(batch) => fetch("/internal/i18n-misses", {7 method: "POST",8 body: JSON.stringify(batch),9 })}10/>