jsLingui VS react-i18next

As we mentioned earlier, the Next.js works well with existing i18n libraries (react-intl, lingui, next-intl, and similar). In this tutorial, we will use the react-intl.

We use LinguiJS on a medium sized project and find it to work really well. It’s small, supports multiple message formats, has CLI scripts for extracting message ids from source, JS apis, Babel macros, React components and hooks, webpack and snowpack plugins, good pluralization support and much more.

I really like https://lingui.js.org/. It will create the .json or .po for you. And the component is just 😍.

I'm a fan of Lingui. I use it for instant.bible.

Lingui JS

lingui

I want to implement translations and I've discovered react-i18next

Let's take the example of next-i18next. While next-i18next uses i18next and react-i18next under the hood, users of next-i18next simply need to include their translation content as JSON files and don't have to worry about much else.

I am using react, i18next and react-i18next. I would like to have some translatable text with HTML link in the middle of the text which is interpolated in react, something like this:

I'm working with i18next for react https://github.com/i18next/react-i18next. I'm struggling to break lines within the string in my JSON language file.

Awesome! Thanks to remix-i18next, i18next, React.js localization and locize your continuous localization workflow is ready to go.

This looks like the normal react-i18next usage. Due to we're not using Suspense here, just make sure you check the ready flag before calling the t function. The translations will get lazy loaded as soon as you navigate on client side to another page.

You can learn more from the official docs here.

You can check this out https://react.i18next.com/.

Refer to Refine i18nProvider for more details and how to use the react-i18next package.

One of the features requested for a personal app of mine was to add multiple languages! Namely German and Spanish. So I decided to go ahead and learn react-i18next.