Skip to main content

i18n

No one modern app can avoid multi language support. Framework supports internalization out of the box.

All internalization based on (i18next)[https://www.i18next.com/] library

Detectors

As we are talking about languages then we need some way for the codebase to understand what language the user should use.

That feature is called detectors.

Out of the box detectors

We support all out of the box detectors from i18n: path, cookie, header, querystring, session and you are able to use it (see configuration session). Please refer to i18n documentation of how to use default detectors and it params

But in addition we provide our own detector “xLang”. This detector will parse “X-Lang” heard on request to detect user language. Frontend should add here user language (“en”,”fr”, etc) and if backend support it that app will use given user language

tip

“xLang” preferred way to work with languages on framework

Example for frontend with axios

axios.get("https://example.com/getSomething", {
headers: {
"X-Lang": "en", // Added language
},
});
const api = axios.create({
baseURL: process.env.APP_SERVER_URL,
headers: {
'Content-Type': 'application/json',
'X-Lang': 'en' // Added language
},

// change it after
api.defaults.headers.common['X-Lang'] = 'fr';

Adding own detector

That time you are not able to add your own detector. Please contact us if you need that option and we will be happy to help you

Configuration

Please look at the ‘config/i18n.js’ file for all configuration options. There are limited amount of options available

Language files

All files in JSON format located on ‘locales/{localeCode}/translations.json’

note

Bakends beside files not supported

You can find details documentation about json files on i18next json documentation

API

Framework provides easy integration for controllers. You can grab i18n instance with

req.i18n;
req.i18n.t("some.phrase");
tip

You can pass controller ‘request’ errors as strings for internalization. And it be processed with i18next

class SomeController extends AbstractController {
get routes() {
return {
post: {
"/login": {
handler: this.postLogin,
request: yup.object().shape({
email: yup.string().email().required("auth.emailProvided"), // <-- look here i18n
}),
},
},
};
}
}