Hopp til innhold
Verbumia

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
projectIdstring— påkrevd
apiKeystring— påkrevd
defaultLocalestringbrowser
defaultNSstring"common"
namespacesstring[]["common"]
cdnUrlstringcdn.verbumia.ca
baseUrlstringapi.verbumia.ca
missingHandlerEndpointstring/v1/missing
debounceMsnumber5000
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

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/>

Neste