Frameworks

i18next

The core framework that is required for any additional library (such as react-18next or next-i18next).

i18next handles

• splitting translations into multiple namespace files

• what to load and how to fallback depending on language

• support for objects and arrays

react-i18next

An internationalisation framework which is based on i18next. It is used together with i18next to provide:

• useTranslation hook

• <Trans> component (to integrate html and react nodes within translation strings, such as for links and formatting)

next-i18next

next-i18next is used on top of i18next and react-i18next.

• It uses features from both frameworks.

• Features such as the useTranslation hook come from react-i18next, but need to be imported from next-i18next.

Next-i18next adds functionality to support SSG/SSR.

Why next-i18next?

• Easy to implement

• It is used with react-i18next, which is one of the most used internationalisation libraries

• Resources/documentation for implementation

  • There are many articles which state how to use next-i18next with the pages directory, including this one

• Loads translations from the local directory structure and renders the pages on server side.