{"id":156725,"date":"2023-02-01T03:25:12","date_gmt":"2023-02-01T09:25:12","guid":{"rendered":"https:\/\/lifeboat.com\/blog\/2023\/02\/react-internationalisation-i18n-with-react-intl-example"},"modified":"2023-02-01T03:25:12","modified_gmt":"2023-02-01T09:25:12","slug":"react-internationalisation-i18n-with-react-intl-example","status":"publish","type":"post","link":"https:\/\/lifeboat.com\/blog\/2023\/02\/react-internationalisation-i18n-with-react-intl-example","title":{"rendered":"React Internationalisation (i18n) with React-Intl example"},"content":{"rendered":"<p><\/p>\n<p><iframe style=\"display: block; margin: 0 auto; width: 100%; aspect-ratio: 4\/3; object-fit: contain;\" src=\"https:\/\/www.youtube.com\/embed\/XcvZPWz510k?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope;\n   picture-in-picture\" allowfullscreen><\/iframe><\/p>\n<p>Check out my courses here!<br \/>\n<a href=\"https:\/\/www.udemy.com\/user\/maksym-rudnyi\/\">https:\/\/www.udemy.com\/user\/maksym-rudnyi\/<\/a><\/p>\n<p>!! Updated version with fix all issues from comments \u2014 <a href=\"https:\/\/youtu.be\/mmCnx0YnBs4\">https:\/\/youtu.be\/mmCnx0YnBs4<\/a>.<\/p>\n<p>Today we\u2019ll implement Internationalisation for our React app. To do any site\/app available for different languages, we can use React-Intl module.<\/p>\n<p>In this React i18n tutorial, we will add 3 different languages: English, German and French. You can add as many as you want languages and it\u2019ll work fine.<\/p>\n<p>GitHub Demo \u2014 <a href=\"https:\/\/github.com\/MaksymRudnyi\/ReactIntlDemo\">https:\/\/github.com\/MaksymRudnyi\/ReactIntlDemo<\/a>.<br \/> React Context tutorial \u2014 <a href=\"https:\/\/youtu.be\/tEFrcYNm9HY\">https:\/\/youtu.be\/tEFrcYNm9HY<\/a><br \/> Create React app \u2014 <a href=\"https:\/\/github.com\/facebook\/create-react-app\">https:\/\/github.com\/facebook\/create-react-app<\/a>.<br \/> React-Intl \u2014 <a href=\"https:\/\/github.com\/formatjs\/react-intl\">https:\/\/github.com\/formatjs\/react-intl<\/a>.<\/p>\n<p>Support this channel:<\/p>\n<div class=\"more-link-wrapper\"> <a class=\"more-link\" href=\"https:\/\/lifeboat.com\/blog\/2023\/02\/react-internationalisation-i18n-with-react-intl-example\">Continue reading \u201cReact Internationalisation (i18n) with React-Intl example\u201d | &gt;<\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Check out my courses here! https:\/\/www.udemy.com\/user\/maksym-rudnyi\/ !! Updated version with fix all issues from comments \u2014 https:\/\/youtu.be\/mmCnx0YnBs4. Today we\u2019ll implement Internationalisation for our React app. To do any site\/app available for different languages, we can use React-Intl module. In this React i18n tutorial, we will add 3 different languages: English, German and French. You can [\u2026]<\/p>\n","protected":false},"author":556,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[20],"tags":[],"class_list":["post-156725","post","type-post","status-publish","format-standard","hentry","category-futurism"],"_links":{"self":[{"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/posts\/156725","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/users\/556"}],"replies":[{"embeddable":true,"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/comments?post=156725"}],"version-history":[{"count":0,"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/posts\/156725\/revisions"}],"wp:attachment":[{"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/media?parent=156725"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/categories?post=156725"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lifeboat.com\/blog\/wp-json\/wp\/v2\/tags?post=156725"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}