Getting started
Last updated
Last updated
react-i18next can be added to your project using npm:
In the /dist
folder you find specific builds for commonjs
, es6 modules
,...
You can also add a script tag to load react-i18next from one of the CDNs providing it, eg.:
unpkg.com
You have two options to translate your content:
Simple content can easily be translated using the provided t
function.
Before:
After:
Sometimes you might want to include html formatting or components like links into your translations. (Always try to get the best result for your translators - the final string to translate should be a complete sentence).
Before: Your react code would have looked something like:
After: With the trans component just change it to:
This basic sample tries to add i18n in a one file sample.
You will get the t function by using the hook or the hoc.
Learn more about the Trans Component
This sample while very simple does come with some to getting the full potential from using react-i18next you should read the extended .
you'll find a simple tutorial on how to best use react-i18next. Some basics of i18next and some cool possibilities on how to optimize your localization workflow.