The documentation is published on react.i18next.com
How will my code look like?
Before: Your react code would have looked something like:
...<div>Just simple content</div><div>Hello <strong ="this is your name">name</strong> you have count unread <Link ="/msgs">Go to messages</Link></div>...
After: With the trans component just change it to:
...<div></div><Trans ="userMessagesUnread" =>Hello <strong =>name</strong> you have count unread message <Link ="/msgs">Go to messages</Link></Trans>...
Head over to the interactive playground at codesandbox.
📖 What others say
- I18n with React and i18next via Alligator.io by Danny Hurlburt
- Building i18n with Gatsby via gatsby.ort by Samuel Goudie
- Get your react.js application translated with style by Jan Mühlemann
- Translate your expo.io / react-native mobile application by Jan Mühlemann
- you're welcome to share your story...
- Simplicity: no need to change your webpack configuration or adding additional babel transpilers, just use create-react-app and go
- Production ready we know there are more needs for production than just doing i18n on the clientside. So we offer wider support on serverside too (nodejs, php, ruby, .net, ...). Learn once - translate everywhere.
- Beyond i18n comes with locize bridging the gap between developement and translations - covering the whole translation process.
Want to learn more about how seamless your internationalization and translation process can be?
# npm package $ npm install react-i18next # bower $ bower install react-i18next
- If you don't use a module loader it will be added to
- Example react with render props
- Example react with hoc
- Example preact with render props
- Example preact with hoc
- Example react-native
- Example expo.io
- Example next.js
- Example razzle
- Example hashbase / beaker browser
- Example storybook
- Example locize.com
- Example test with jest
- react >= 0.14.0 (in case of < v16 or preact you will need to define parent in Trans component or globally in i18next.react options)
- i18next >= 2.0.0
localization as a service - locize.com
Needing a translation management? Want to edit your translations with an InContext Editor? Use the orginal provided to you by the maintainers of i18next!
With using locize you directly support the future of i18next and react-i18next.