React Internationalization with i18next and Translation Management in Under 15 Minutes

preview_player
Показать описание
Today we're going to set up i18next with React and use i18nexus to manage our translations. Not only that, we're going to set up our app to be automatically translated with Google Translate!

Libraries used:
i18next
react-i18next
i18next-http-backend
i18next-browser-languagedetector

  1. i18nexus
  2. i18next
  3. i18nexus
  4. reactjs
  5. javascript
  6. react-i18next
Рекомендации по теме
React i18next (Complete 0:31:11

React i18next (Complete Tutorial)

react-i18next in 8 0:08:16

react-i18next in 8 minutes

How to Internationalize 0:27:38

How to Internationalize a React App - Step-by-Step Guide | i18n - RethinkingUI |

React Internationalization with 0:13:43

React Internationalization with i18next and Translation Management in Under 15 Minutes

Localize React with 0:10:22

Localize React with i18next in Storybook

React Multi Language 0:38:35

React Multi Language App - i18next Tutorial

i18next Crash Course 0:21:16

i18next Crash Course | the JavaScript i18n framework

React Internationalization (i18n) 1:18:38

React Internationalization (i18n) with React-Intl example. The complete guide.

Translating React apps 0:24:27

Translating React apps with I18next

react translation with 0:11:16

react translation with i18next and saving to localStorage

Type-Safe Translations with 0:05:05

Type-Safe Translations with i18next for your TypeScript project

Internationalization (i18n) with 0:09:16

Internationalization (i18n) with Next.js!

Internationalization in React 0:09:45

Internationalization in React | i18n react | #2 | React Js Project Modules

React - i18n 0:43:11

React - i18n - internationalization

Internationalization in React 0:24:36

Internationalization in React - Talk by Naomi Meyer

🧽 What Is 0:04:11

🧽 What Is Internationalization (I18N) | Localization Basics

React-i18next (i18n, l10n). 0:33:04

React-i18next (i18n, l10n). Додаємо декілька мов на сайт. Локалізація та Інтернаціоналізація...

React Multi Language 0:18:20

React Multi Language App - I18next Tutorial

React Native Multi 0:14:34

React Native Multi Language App Using i18next

Localise React Applications 0:04:38

Localise React Applications Using I18Next

Next.js App Router 0:29:32

Next.js App Router with i18next (Internationalization Tutorial)

i18n-ally plugin on 0:08:28

i18n-ally plugin on VS code demo for react-i18next project

Tech Tips on 0:01:32

Tech Tips on on React Native Internationalization with i18next

Как добавить мультиязычность 0:06:25

Как добавить мультиязычность React приложению | i18next

Комментарии
Автор

underrated guide tutorial, this is the perfect explaination video i ever found on YouTube

rach
Автор

Thank you i18n for creating great API :)

farhanfadil
Автор

Great vide, thank you! wish there was better quality video. 720p hurts my eyes.

reddevilv
Автор

Huge thanks, it's the easiest way to make it;
I wanted to ask if there is anyway to add buttons so that the user selects the language.

jlassifourat
Автор

is it possible to edit the translated strings?

omarmanaabon
Автор

Huge thanks for this lesson.
What if we need to translate a variable outside of the React component?
For example some shared labels variable from constants.js file (which was used in different files). Translation appears only after page refreshing. Any workaround?

nikitastriuk