i18next Translation User Interface - is a tool to manage translation right from your web application. It is React based component.
Inspired by POEditor design.
Note: Soon I will provide docker container for those who do not like or do not use react. ;)
- Standart Translation User Interface for i18next is deprecated and too old.
- http://locize.com is a cool tool, but it is too complex for small teams and indie projects.
- I did not find any FOSS stuff to manage translations from i18next.
- That tool is not a competitor for http://locize.com.
- It is developed just to cover basic needs in translation management.
- Getting Started
- Development and contribution
- Built With
These instructions will help you with the integration or contribution of that library.
Tested on React v16+ with Node v9.3.0
npm install -d i18next-tui// oryarn add i18next-tui
It is recommended to create protected(for dev only) route inside your app and insert component there.
You have 2 options to generate
- Import JSON directly. Not recommended, because it will increase the size of your bundle. But it is a fast and easy way to test.
Use that approach if you have not integrated i18next or you just want to test the app. Or you have some custom dynamic wrapper on top of i18next and some dynamic translations.
import de from "/src/locale/de/translation.json";import en from "/src/locale/en/translation.json";const namespaceList =locales:lang: "en"translations: enlang: "de"translations: dename: "Translation";
Dynamically grabs content based on translations you have loaded.
import i18n from "i18next";if !i18nisInitializedreturn;const namespaceList = i18noptionsns;
How to generate JSON translations?
If you do not know how to generate JSON files with translation from your source code. You can use
Development and contribution
Note: Do not use
yarn for dev env. There is no lock file for yarn.
You can build sources with
npm run build.
To analyze dependencies use
npm run build -- --analyze;
To serve a demo use
npm run serve.
npm run all
To simplify life - before committing you can run
all command to build, test, update snapshots, lint.
Running the tests
Jest is used for testing purposes. You can run tests with
npm test or use watch mode with
npm run test-watch.
Coding style tests
Linters are used to prevent bad code. Use them before creating a commit.
npm run lint
Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.
This project is licensed under the MIT License - see the LICENSE.md file for details