# How to use basic translation features in i18next

I'll show you how to use basic translation features in [i18next](https://www.i18next.com):
* nested keys
* substitution

# Starting point
We start with the code in the [previous step](https://how-to.dev/how-to-add-simple-internationalization-with-i18next-for-a-browser-application). It's already set up for the node & browser use.

# Code
The complete code to be placed in in `src/index.js`:
```JS
import i18next from "i18next";

const en = {
  translation: {
    hello_world: "hello world",
    nested: {
      key: "This key is was read from nested object",
    },
    great: "Hello {{name}}",
  },
};

i18next
  .init({
    lng: "en", // if you're using a language detector, do not define the lng option
    resources: {
      en,
    },
  })
  .then((t) => {
    console.log(t("hello_world"));
    console.log(t("nested.key"));
    console.log(t("great", { name: "Marcin" }));
  });
```
## Nested keys
It allows us to organize our keys in some logical structure. For example, we could have something like:
```JSON
{
  "dialogBox": {
    "close": "Close"
    "ok": "OK"
  },
  "error": {
     "notEnoughSpace": "Not enough space"
  }
}
```

## Variable interpolation
The basic feature of any i18n library. It allows us to put placeholders in the translation & set the value in the runtime.

# Working application
The code in action:
```shell
$ node src/index.js 
hello world
This key is was read from nested object
Hello Marcin
```

# Links
* [repository](https://github.com/how-to-js/i18next-vanilla)
* [branch](https://github.com/how-to-js/i18next-vanilla/tree/basic-features)
* [sign up to be notified about video course](https://www.subscribepage.com/free_i18next_course)

# Summary
In this article, we have seen how to use basic translation features from i18next.