2

I have spend a week to figure out this question currently I'm using gatsby to generate my static web app. i have tried to do it

-pages 
--en 
---index.js 
---main.md 
---contact.md 
--zh 
---index.js 
---main.md 
---contact.md

it's kind a works, but still not exactly perfect solution. i'm thinking about impelent React-Intl but i'm not sure. is it possible for static app/webpage?

any other suggestion ?

Necmttn
  • 1,137
  • 1
  • 9
  • 17
  • 1
    It seems like this would work just fine? What problems are you facing? Most multi-language sites I've seen namespace the different language pages like you're doing e.g. `/en/main/` & `/zh/main/` – Kyle Mathews Oct 09 '16 at 04:58
  • Also react-intl will work just fine w/ Gatsby. Gatsby treats React the same as any normal React/Webpack project so if it works elsewhere, it'll work in Gatsby. – Kyle Mathews Oct 09 '16 at 04:59

2 Answers2

2

we use Instant as a multi-language solution for React. We have a static generated React app that we deploy to S3 and serve through CloudFront. In you React router you can make sure all paths are caught like /en/some-page and /fr/some-page. Then, based on this route you set the correct Locale in Instant and the tool will serve the correct language to the visitors.

Marcel Panse
  • 572
  • 1
  • 6
  • 13
  • in this way, you have generate to many files. after while it's get mess. to many file is hard to control. i find react-intl does better job. you can have n json file for n language and you're done. – Necmttn Feb 14 '17 at 02:24
0

My current approach is using react-intl and Gatsby-plugin-i18n together. so I keeping the content of the pages in Gatsby-plugin-i18n and for everything else in react-intl. which is works totally fine so far.

Necmttn
  • 1,137
  • 1
  • 9
  • 17