> ## Documentation Index
> Fetch the complete documentation index at: https://help.experro.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Manage internationalization

Internationalization is the process of designing your project to support multiple languages and regions.

It will be provided by Experro’s **basetheme**, integrated for the default channel in **English - United States** with the language code **en-us**.

you can take a look at the main configoration files, under

```txt theme={null}
src
 └── locale
      ├── en.json
      └── index.ts
```

`en.json` Contains,

It will have just normal json object like,

```json theme={null}
{
  "translation": {
      "common": {
        "model_select_msg": "Please select a record"
      }
    // Object keys for internalization,
  }
}
```

`index.ts`

> When creating a new config file for another language, remember to add an entry in the `index.ts` file of the `locale` folder.

```js theme={null}
import en from './en.json';

// NOTE 1 : Ensure that each key in the following object is formatted according to the specified pattern: "en-US" or 'en-MX'.
//          The language code before the '-' should be lowercase, while all characters after the '-' should be uppercase.

// NOTE 2 : Ensure that the object name 'exp_lang' remains unchanged; otherwise, it may not function as expected.
// NOTE 3 : For the default or fallback language, use the key 'en' exclusively, as demonstrated in the following object.
const exp_lang: any = { 'en-US': en };

export { exp_lang };
```

That’s all for setting up internationalization and configuration.

Here’s how you can use internationalization during theme development:

```js theme={null}
import { useTranslation } from 'react-i18next';

const ExpBanner = () => {
    const { t } = useTranslation();

    return (
        <div>
            Next word is translated: {t('common.model_select_msg')}
        </div>
    );
}
```

That’s all—it’s that easy to use!