Implement i18n

[peduarte]

We could use gatsby-plugin-i18n

[DirtyF]

Correct me if I'm wrong; based on the starter source translations go into local/messages. Within this folder we have one file per language, for instance:

en.json:

{
  "JAMstack is revolutionising the way we think about workflow by providing a simpler developer experience, better performance, lower cost and greater scalability.": "JAMstack is revolutionising the way we think about workflow by providing a simpler developer experience, better performance, lower cost and greater scalability.",
  "This simple guide will help you understand why it exists and how to get started.": "This simple guide will help you understand why it exists and how to get started",
  "Table of contents": "Table of contents",
  "What is JAMstack?": "What is JAMstack?",
  "Meaning": "Meaning",
  "Benefits": "Benefits",
  "Best practices": "Best practices",
  "Getting started": "Getting started",
  "Development": "Development",
  "Deployment": "Deployment",
  "Dynamic parts": "Dynamic parts",
  "Resources": "Resources",
  "About": "About"
}

fr.json

{
  "JAMstack is revolutionising the way we think about workflow by providing a simpler developer experience, better performance, lower cost and greater scalability.": "La JAMstack révolutionne notre façon de penser la chaîne de publication en proposant, une expérience de développement plus simple, une meilleure performance, et une plus grande scalabilité.",
  "This simple guide will help you understand why it exists and how to get started.": "Ce petit guide vous aide à comprendre pourquoi elle existe et comment bien démarrer.",
  "Table of contents": "Sommaire",
  "What is JAMstack?": "C'est quoi la JAMstack ?",
  "Meaning": "Signification",
  "Benefits": "Bénéfices",
  "Best practices": "Bonnes pratiques",
  "Getting started": "Bien démarrer",
  "Development": "Développement",
  "Deployment": "Déploiement",
  "Dynamic parts": "Parties dynamiques",
  "Resources": "Ressources",
  "About": "À propos"
}

[peduarte]

Yeah, but I'd like to explore using translations with MDX.

I think there may be a way to have each content in a Markdown file.

So For example:

what-is-jamstack.en.md
what-is-jamstack.fr.md
getting-started.en.md
getting-started.fr.md
...

then with mdx render that within React, and map the html elements to React Components so I can add the extra components, such as the diagrams etc...

Not sure if it'll work!