Getting Started

What is @onruntime/translations?

@onruntime/translations is a lightweight, type-safe internationalization (i18n) library designed for React and Next.js applications. It provides a simple API for managing translations with full TypeScript support.

Why Use It?

Type Safety

Get compile-time errors when using invalid translation keys:

const { t } = useTranslation("common");

t("greeting");        // ✅ Valid key
t("invalid_key");     // ❌ TypeScript error

Simple API

Just two hooks for all your translation needs:

// Client Components
const { t } = useTranslation("namespace");

// Server Components (Next.js)
const { t } = await getTranslation("namespace");

Organized Translations

Keep your translations organized with namespaces:

Quick Example

// locales/en/common.json
{
  "greeting": "Hello, {name}!"
}

// Component
import { useTranslation } from "@onruntime/translations/react";

function Welcome({ name }) {
  const { t } = useTranslation("common");

  return <h1>{t("greeting", { name })}</h1>;
}

Next Steps