Skip to content
Get packs

react-i18next

Adds translation support to React apps, built on the i18next ecosystem.

GitHub Download source
Stars
10.1k
Forks
1.1k
Licence
MIT
Language
JavaScript
Last update
4 days ago
Type
Library

What it is

react-i18next is a JavaScript library that lets React apps display text in multiple languages. It connects React components to the i18next translation engine, so you mark strings with a key and the library shows the matching translation for the user's language. The README says it works with React and React Native and includes a Trans component for text that mixes markup and variables.

  • Replace hardcoded strings in a React component with t() calls that pull translations by key
  • Use the Trans component to translate a sentence that contains links, bold text, and variables like a user name or count
  • Load translation files from a backend plugin (the README mentions i18next-locize-backend as one option)

Great for

  • React developers who need their app available in several languages
  • Teams already using the i18next ecosystem or planning to support server-side i18next too
  • React Native developers, provided they use react-native 0.59.0 or higher for hooks

Not ideal for

  • Projects that do not use React, since the library is built specifically for React components
  • Users on the legacy v9 API who cannot move to hooks; the README points them to a separate v9.x.x branch instead
  • Teams wanting a managed translation service, because the README promotes Locize as an optional paid add-on rather than a required part
Step-by-step guide: how to use react-i18nextInstall, first run, examples, tips and FAQs
react-i18next alternativesreact-i18next vs react-loadable

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js and npm · React 16.8.0 or higher (per README requirements) · i18next 10.0.0 or higher (TypeScript users: 17.0.9 or higher)

    Install the npm package

    npm install react-i18next
  2. 2

    Run it

    • Install i18next and react-i18next with npm
    • Create translation resources and configure i18next (see the documentation at react.i18next.com)
    • Wrap strings in your components with the t function or the Trans component
    • Run the example projects in the repository (example/react) to see a working setup
  3. 3

    Get the most out of it

    • Use the Trans component for sentences that include inline markup and variables, as shown in the README's before-and-after example
    • Check the official docs at react.i18next.com for full configuration options
    • Use the TypeScript example in example/react-typescript if your project uses TypeScript
    • Review the i18next AI coding agents guide linked in the README if you use AI tools for translation work

Downloads

Source code (.zip)master branch · straight from GitHubOfficial website & docsreact.i18next.com

Strengths

  • The README describes a simple setup that does not require changing webpack or adding extra Babel transpilers
  • Part of the wider i18next ecosystem, which the README says supports server-side languages such as Node.js, PHP, Ruby and .NET
  • Active repository with CI, a published npm package, and a large star count (10,062 at time of metadata)

Trade-offs

  • The README is truncated and does not show full API details, so the depth of features is hard to judge from it alone
  • No release is listed in the metadata, so versioning and stability guidance must be taken from the README's branch notes
  • Much of the README is promotional content for Locize, which is optional and should be weighed accordingly

How it compares

ProjectStarsTypeLevelUpdatedBest for
react-i18next (this)10.1kLibraryintermediate4 days agoReact developers who need their app available in several languages
react-hook-form44.9kLibraryintermediate5 days agoReact developers building forms with several fields
swr32.5kLibraryintermediate20 days agoReact developers who fetch data from APIs in components
leptos21.5kLibraryadvanced4 days agoRust developers who want to build full web apps in one language
react-loadable16.5kLibraryintermediate2.3 years agoReact developers whose main JavaScript bundle has grown large
pinia14.8kLibrarybeginner10 days agoVue 3 developers who need shared state across several components

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.