I am using i18next and react-i18next to internationalize my app.

​
Simple explanation:

If you device language is Turkish and your app has Turkish translations, it will show the translations for the Turkish. Otherwise, it will show the translations for English.

I mean, default version is English.

1

First, go to the i18n folder. Then, open the i18n/index.ts file.

2

Make sure you have the translations for the languages you are using. Like below:

i18n/index.ts
const resources = {
tr: { translation: translationTr },
en: { translation: translationEn },
de: { translation: translationDe },
es: { translation: translationEs },
};
3

Important thing is you should have the translations for the languages you are using.

4

Define your translations for the languages you are using. Like below:

i18n/locales/en-US.ts
{
"language": "...",
 "success": "Success",
... 
}
5

Finally, you can use the t function to get the translations. Like below:

component.tsx
const { t } = useTranslation();

return <Text>{t('success')}</Text>

Was this page helpful?

Redux ToolkitTheming