Translation files

Learn translation JSON files.

Translation files

Translation files are one JSON file per language. tr.json holds Turkish, en.json holds English. Each file has the same key structure; only values differ.

Example tr.json: { "hello": "Merhaba", "bye": "Hoşça kal" }. Example en.json: { "hello": "Hello", "bye": "Goodbye" }. Keys are the same; values change by language. Files live in a folder like ./locales/. Nesting is allowed: { "cart": { "total": "Total" } }. This keeps order in big projects.

Nested keys

In big projects keys are nested. For example { "cart": { "total": "Total", "empty": "Cart is empty" } }. This groups all cart strings in one object.

Access: t('cart.total'), t('cart.empty'). The dot walks the nested levels. This method keeps order as the key count grows. For example 'cart.total' and 'profile.name' are in separate groups; collision risk drops. The file structure must stay consistent across the project; a key is defined once.

Exercise Write a translation file

Write the content of an en.json. The root object has a "greeting" key with value "Hello" and a "farewell" key with value "Goodbye".

Show example solution

{
  "greeting": "Hello",
  "farewell": "Goodbye"
}

Test yourself

Match each file to its language

tr.json

Turkish
en.json

English
fr.json

French
de.json

German
Nested key access
```
t('____.total');
```
Show answer
```
t('cart.total');
```
How is a nested key accessed?
```
t(?)
```
- With a dot: 'cart.total'
- With a slash: 'cart/total'
- With an arrow: 'cart->total'
- With an underscore: 'cart_total'
Show answer

With a dot: 'cart.total' — The dot walks the nested levels.

Next lesson: useTranslation

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies