Add Internationalization (i18n) to a React app using React Intl

15 - 16
Damon Bauer

Damon Bauer

Front End Developer from Nashville, TN. Pretend woodworker. Mountain bike poseur. Coffee snob.

About the Course

In this course, we will incorporate react-intl into a project created with create-react-app and react-router. The react-intl library makes complex tasks such as internationalization and formatting dates & currency incredibly simple. Another huge benefit of react-intl is that it gives you the ability to centralize the content across your application into language specific files. This creates a consistent place to find content and encourages reuse. If you’ve ever used language specific yml files in Rails, you’re already familiar with this pattern.

Starting with the entry point of the application, we will hit the ground running by adding the necessary components and data structures required for react-intl to function. From there, we will use react-intl components to format various types of data including strings, dates, and numbers. We will also work through writing tests for components that include react-intl components using Jest and enzyme.

Last Reviewed