DEV Community

Cover image for React i18n but ugly
Iurii
Iurii

Posted on

React i18n but ugly

Behold! A backend developer will teach you how to frontend.

But the main point is to demonstrate how to engineer an ugly solution of already solved problem that makes sense.

Scope

Mostly static site, React, Next.js App Router, markdown blog with multiple languages.

Readily available: react-intl or i18next.

Problem #1

output: "export" means no middleware, no cookies, no runtime detection — we rely on the filesystem.

Problem #2 (the showstopper)

What you’re “supposed” to do is to create and maintain:

messages-en.json
messages-es.json
messages-fr.json
....
Enter fullscreen mode Exit fullscreen mode

That means

  • I need to repeat the website structure in each of these files
  • Every time I need to add, tweak, or move a button, I need to modify all messages-${lang}.json files simultaneously

...

Full version at iurii.net — no ads, no tracking, no inbox spam.

Top comments (0)