Translation Editor
Save time on handling localization files and translation strings.
Try SimpleLocalize
Share article

List of i18n libraries for React, React Native, and NextJS

List of i18n libraries for React, React Native, and NextJS

The CSA Research study shows that 66% of business users are more likely to pay more for a localized service than one in a foreign language. The majority prefer to consume and interact with content in their native language, as it feels more natural and simply right, even for users with advanced English proficiency. The preference for localized products is well noted in software localization.

As you can see, internationalization of your project is critical for its success, if you plan to go to market in a different country. To take that step and introduce i18n support in your project, there are a few important thighs to consider while searching for the right tools. In this blog post we will cover one of them, a very base for proper software localization, which is localization library.

You can access our full list of localization libraries and tools on Github. You are welcome to add your resources as a pull requests or just create a new issue.

Top React localization libraries

See our list of the best React libraries we gathered. We focused mainly on ReactJS, React Native and Expo libraries.

1. FormatJS

FormatJS provides i18n and l10n support for web applications with several packages, such as react-intl, which is a package specifically designed for use with React. React-intl provides React components and utilities for formatting messages, dates, times, and numbers according to different locales. It also supports pluralization and gender agreement.

FormatJS library

See also

2. next-translate

next-translate is a lightweight translation library for Next.js. It provides an easy way to add i18n support to Next.js projects, with features such as automatic language detection, dynamic translations, and support for multiple locales.

It all started when the developers realised how important is i18n for SEO, and thanks to the community, Next.js decided to introduce internationalized routing. Internationalized routing became available in Next.js 10.

next-translate

See also

3. react-i18next

React-i18next is one of the most popular localization libraries among React developers. Commonly used in React localization. It can be used with React Web and React Native. i18next was primary created for React only, but the community gathered among the library created integrations for other frontend frameworks such as AngularJS, Vue.js and more.

See also

react localization

4. LinguiJS

LinguiJS is a JavaScript library for internationalization and localization of web applications. It offers message extraction and formatting, supports dynamic content, and integrates with popular front-end frameworks like React and Vue.js, Node.js, and Angular. It provides a comprehensive and well optimized set of tools for developers to create applications that can be easily adapted to different languages

Comparision of LinguiJS with react-intl

next-translate

5. react-native-localize

React-native-localize is a library for React Native that provides a set of tools for internationalizing and localizing mobile applications. It offers a range of features such as date and time formatting, number formatting, and text direction based on the user's locale. It also provides a simple API for translating strings in your application, making it easy to adapt your app to different languages and cultures.

This library is a toolbox for your React Native app localization.

react-native-localize

6. FormatJS CLI

FormatJS CLI extracts messages from a project with FormatJS library. Learn how to upload extracted translation messages to SimpleLocalize.

formatjs cli

7. react-i18nify

React-i18nify is a simple group of translation and localization components and helpers for your React application.

react-i18nify

8. react-littera

react-littera is a fairly new library for React localization. It was created to make maintaining and managing translations easier. It allows placing translations right beside your component, as well as storing translations globally. Littera's structure was inspired by react-jss.

react littera for managing translations

npm install --save @assembless/react-littera

9. react-persian

react-persian is a library for Persian localization in React. It provides a set of components for Persian localization. Are you developing an application for a Persian audience? You should definitely check this library out.

react-persian

10. react-translate

bloodyowl/react-translate is a set of React utilities for simple i18n handling. The library is a bit outdated, last commit was in 2019, and last release is dated to end of 2016.

If some reason you didn't like FormatJS, then the library is worth checking.

react-translate

11. react-translated

react-translated is a dead simple way to add complex translations in a React project. The library is a bit outdated but definitely work checking!

react-translated

12. react-intl-hooks (for FormatJS)

React-intl hooks is a small and fast library that you can use to replace FormatJS components. It combines the great things about react-intl along with React hooks. It provides a t function, which works like the t function in the i18next library.

const t = useFormatMessage();
t({ id: 'learn-react', defaultMessage: 'Learn React' })

react-intl hooks

npm install --save react-intl-hooks

13. typesafe-i18n

typesafe-i18n is an opinionated, fully type-safe, lightweight localization library for TypeScript and JavaScript projects with no external dependencies.

typesafe-i18n - demo

npm install --save typesafe-i18n

14. SimpleLocalize CLI + TMS

SimpleLocalize allows you to upload and manage translation keys in the cloud. The free account allows you to host up to 250 translation keys, and you can test it for bigger files during a 14-day trial. You can create your account here.

1. Upload translations

Upload your translation files using SimpleLocalize CLI, API or import translations using our web app and file format of your preference.

How to upload translation files with command-line tool

2. Translate in editor

Add new languages and translations in a simple translation editor, adjusted to the whole team's needs. Show code or key descriptions, adjust editor view to your preferences, and work in a developer-friendly environment.

How to change translation in Translation Editor

You can use DeepL or Google Translate to translate texts automatically.

3. Download translations

When the translations are ready, you can download them in multiple ways. Export translations inside SimpleLocalize or use or CLI and API to get ready to use translation files.

How to download translation using command-line tool

4. Localization hosting

Check also our translation hosting option to keep your localization files in the cloud. Access them easily with superfast CDN and fetch your updated translations anywhere and anytime.

See also:

👋 Thanks for reading!

Relevant posts

Check out our latest blog posts and stay up to date with SimpleLocalize

How to auto-translate JSON files

How to auto-translate JSON files

Kinga WojciechowskabyKinga Wojciechowska5 min read

Simplify your localization process by learning how to auto-translate JSON files with SimpleLocalize's translation editor and auto-translation feature.

Continue reading
List of country flag icon projects

List of country flag icon projects

Jakub PomykałabyJakub Pomykała3 min read

This is a practical compilation of resources for country flags, which can benefit both designers and developers.

Continue reading
How to create a language selector with Tailwind CSS

How to create a language selector with Tailwind CSS

Jakub PomykałabyJakub Pomykała11 min read

Learn how to create a language selector for your website easily using Tailwind CSS. Follow our step-by-step guide for seamless localization.

Continue reading