React localization that stays connected to product delivery.

Add OTA translations with @rerune/react 1.6.0. Replace native initialization and the root provider, keep options, resources, and useTranslation() calls, and restore native startup when removing ReRune. Apps with plugins retain their own instance.

Start localizing See workflow

ReRune dashboard showing localization workspace activity and project status

ReRune projects list showing real localization projects in a workspace

ReRune project keys view for managing software translation keys

ReRune OTA demo mobile app landing screen with live localization status

ReRune OTA demo mobile app story screen showing runtime translation content

Common challenge

Files and hooks handle runtime translation, but growing React teams still need shared status, review, terminology, and release coordination.

Best fit

React teams using i18next that want @rerune/react@1.6.0, runtime variants, OTA delivery, immediate fallback, read-only browser credentials, and crawler-visible rendering.

How ReRune helps

ReRune.setup(..., nativeOptions) initializes the existing i18next instance, and ReRuneProvider replaces I18nextProvider. Your resource files, plugins, and native translation calls stay in place.

SDK technical reference

React Web

@rerune/react 1.6.0 creates i18next from your native options and replaces the root provider. Keep translation calls and resources, with browser caching and a separate SSR preload flow.

Version-pinned guidance from the published package README. Follow the linked README for the complete API and current release notes.

Package: @rerune/react
Current release: 1.6.0
Requirements: React 18+, i18next 23+, react-i18next 14+

Install command

npm install @rerune/react@1.6.0 i18next react-i18next

View on npm React example app Setup guide Runtime behavior SSR and SEO

The linked example apps use SDK 1.6.0. They include native setup, language and variant controls, and manual refresh. Use the package README for the API reference.

Quick Start

@rerune/react@1.6.0

View on npm

Install command

npm install @rerune/react@1.6.0 i18next react-i18next

Keep native configuration

Keep your existing native options and JSON resources. These imports use example paths; keep your own paths and settings. The object can stay in your current startup or be inlined. No new file or exported options object is required. Both alternatives use these same options, including escapeValue: false.

Keep native configuration

import type { InitOptions } from 'i18next'
import en from './locales/en/translation.json'
import de from './locales/de/translation.json'

const nativeOptions = {
  lng: 'en',
  fallbackLng: 'en',
  ns: ['translation'],
  defaultNS: 'translation',
  resources: { en: { translation: en }, de: { translation: de } },
  interpolation: { escapeValue: false },
} satisfies InitOptions

Alternative setups: replace Before with After. Do not run both.

Replace initialization

Keep imports at module scope and put the awaited call in your existing async startup. nativeOptions is your unchanged configuration above. Keep loading and error handling, then mount after initialization resolves. Run setup once, never during each render.

After ReRune

import { ReRune } from '@rerune/react'

const client = await ReRune.setup({
  otaPublishId: '<READ_ONLY_OTA_PUBLISH_ID>',
}, nativeOptions)

SDK 1.6.0 creates an isolated i18next instance and copies bundled resources. Native languages and resources are configured once. Setup waits for native initialization; cache restoration and OTA run asynchronously. First-run offline startup needs locally available resources; previously fetched OTA needs retained cache.

Replace the root provider

In your existing root, use i18n or client from the chosen startup after it resolves. App is your existing component. Preserve defaultNS when used. ReRuneProvider includes native context; do not nest both providers. External translation or language-switching code can use client.i18n.

After ReRune

import { ReRuneProvider } from '@rerune/react'

<ReRuneProvider client={client} defaultNS="translation">
  <App />
</ReRuneProvider>

Browser startup only. SSR still needs request-local initialized i18next, awaited ReRune.preload(...), matching native base resources, and transferred initialHydrationState. OTA targets the literal translation namespace; native supportedLngs restricts language selection, not OTA downloads.

Existing instances, plugins, and attachment

For backend loaders, detectors, .use(...) plugins, or global-instance wiring, retain your app-owned i18n instance and pass it to ReRune.setup with the same nativeOptions. App-owned options keep their native defaults. For an already initialized instance, omit the second argument; passing options again rejects. Hooks outside ReRuneProvider need your existing global wiring. Native HTTP loaders keep their startup and offline requirements. SDK-created instances default escaping to false; explicit options win, and raw HTML still needs appropriate handling.

Setup with your existing instance

import { ReRune } from '@rerune/react'

const client = await ReRune.setup({
  i18n,
  otaPublishId: '<READ_ONLY_OTA_PUBLISH_ID>',
}, nativeOptions)

Keep your existing application component and native translation calls. This example reads the headline key from your resources.

Translation code stays the same

import { useTranslation } from 'react-i18next'

export function App() {
  const { t } = useTranslation()
  return <h1>{t('headline')}</h1>
}

Removing ReRune

Restore both Before ReRune blocks with the same options and resources. Remove optional ReRune refresh, status, and variant controls, then uninstall the SDK. Keep i18next, react-i18next, and your plugin chain. Replace client.i18n references with your native instance. Native bundles or loaders must cover the messages you need: OTA and variants stop and ReRune’s cache is no longer consumed. Apply this source change and restart the app; unmounting a provider is not live rollback.

Uninstall the SDK

npm uninstall @rerune/react

Workflow

From app copy to release-ready localization.

ReRune connects translation management to the delivery path developers already use: dashboard work, AI assistance, CLI/API sync, and OTA updates where a supported SDK is installed.

Install the SDK

Connect the supported app runtime to a ReRune publish ID while keeping native or framework localization behavior in place.

Publish approved text

Approve translation changes in the workspace, then publish runtime updates without turning every text fix into a full store release.

Refresh visible copy

Let supported SDK hooks check for updates and refresh text when new approved localization payloads are available.

Keep fallbacks intact

When runtime updates are unavailable, the app keeps reading bundled resources so localization failures do not break the product.

Agent-assisted setup

Run one command. Your coding agent integrates ReRune.

Run the onboarding command from the root of your Git repository. The wizard detects the app and compatible coding agents already installed, then launches the agent you choose to move static UI text into localization, connect ReRune when cloud setup is selected, and validate the result.

Run inside your Git repository

$ curl -fsSL https://rerune.io/onboard.sh | sh

View current script View v1.2.6 Changelog

The script runs locally. ReRune does not receive your source code or list of installed agents.

Run the onboarding command
Start it from the repository root. It stays in the terminal and detects the app, existing localization, and supported coding agents already installed.
Confirm the detected setup
Review the source locale, Git branch, and whether to connect ReRune cloud and add supported OTA delivery. Nothing changes until you confirm.
The agent completes the integration
The selected agent migrates user-facing strings into the app's localization system, connects ReRune when cloud setup is selected, adds supported OTA setup when requested, and runs the relevant validation.

Coding agent integrations

11 integrations: 4 available now, 7 planned.

Claude CodeReady
CodexReady
OpenCodeReady
PiReady
GitHub Copilot CLIPlanned
GoosePlanned
Qwen CodePlanned
Cursor AgentPlanned
Kiro CLIPlanned
Cline CLIPlanned
Factory DroidPlanned

Coverage

App-first does not mean mobile-only.

Start where localization creates release friction, then keep web, mobile, and cross-platform products in one shared workspace as your surface area grows.

Web apps and browser-based products

React web apps with the public OTA SDK

Angular apps with ngx-translate or Transloco React Native apps with the public OTA SDK Flutter apps with the public OTA SDK Native Android apps with the public OTA SDK Native iOS apps with the public OTA SDK

Developer delivery

Sync through the CLI. Publish through OTA SDKs.

Use the ReRune CLI locally or in CI/CD to manage project translations, then deliver approved runtime updates through the SDK built for your app.

Companion CLI

Install the ReRune CLI

Use the ReRune CLI to sync, validate, and manage translations right from your terminal. Run syncs in CI/CD or locally whenever you need to push a new language.

Homebrew (macOS/Linux):

brew install BasalBit/tap/rerune

Downloadable builds for macOS, Linux, and Windows
Uses the API keys you generate in the dashboard
Fits scripted CI/CD workflows through CLI and API access

rerune

Connect the project

Create the project config and connect the repository to its ReRune workspace.

rerune pull

Pull approved updates

Bring current dashboard translations into the app or its build workflow.

rerune push

Push local changes

Send local translation updates back to ReRune for the team to manage and publish.

Questions

Questions teams ask before choosing a localization platform.

Contact the ReRune team

Share an idea, report a problem, or ask for help with ReRune.

Does ReRune replace i18next or react-i18next?

No. Keep i18next, react-i18next, native options, resources, and translation calls. SDK 1.6.0 can create an isolated instance with ReRune.setup({ otaPublishId }, nativeOptions). Replace I18nextProvider with ReRuneProvider and preserve defaultNS. Apps with plugins or global wiring retain their instance and pass i18n. OTA targets only the literal translation namespace.

How do React SSR pages preload OTA translations?

Create and initialize a request-local i18next instance, await ReRune.preload(...), then render translated HTML and metadata. Transfer its hydrationState into browser setup as initialHydrationState, with the same original native resources, locale, variant, and syntax. Mount ReRuneProvider after setup resolves; delayed hydration also needs hydrationReady. Browser-only setup does not replace this SSR flow.

Is the ReRune React SDK publicly available?

Yes. @rerune/react@1.6.0 is published on npm for React apps that use i18next and react-i18next.

Can I preview draft translations in a running app before publishing?

Yes. Enable OTA staging for the project and opt a development or QA client into staging mode. The client receives saved, enabled draft snapshots on its next sync from a cache kept separate from published content. Production clients stay on the published path by default.

Explore next

Keep exploring the localization workflow.

Go deeper into the developer, platform, and delivery workflows connected to this page.

Start with one product workflow and expand from there.

Create projects, manage keys, use AI assistance with context, sync through CLI/API, and publish approved runtime updates when your app uses a supported ReRune SDK.

Start localizing Pricing