How do you do language translations

Wednesday, September 25, 2019

Having worked at a company that supported a large number of languages I always wondered how other developers managed theirs.

The basic idea when I first started was: static JSON files with key value pairs.

So English might look like:

{
    "welcome": "Hello!"
}

Then in the code you would reference the key to fill in the value.

Something like:

<Translate>welcome</Translate>

That’s not a bad solution and the basic ideas were pretty alright. However, it has a few problems.

  1. The people who can translate for you don’t usually know JSON
  2. It doesn’t provide much context on what the translation should be
  3. It requires a code release every time you need to update a language or even fix a typo.

# 1 is not too hard. You can convert to CSV for loading into excel which is a tool most people know. You can still run into data conversion issues.

# 2 I never had a great solution for. Typically you would have to do a lot of work to provide screenshots and go back and forth for them to have proper context. If you site was already live it was easier since they could just look at the live site.

# 3 Can be solved with hosting the JSON in another place such as S3 and have the app pull the data from there. But then you no longer have version control.

Eventually I created an internal app to solve # 1 and # 3. It was a react app that used firebase as the storage. It integrated with our LDAP so we had simple SSO. We also had language and environment based permissions. You could say a user could only access French in dev. It had a way to promote dev to production as well.

Firebase was nice to use in that you can have direct JSON access URLs so the consuming app never had to install their bulky tools. (It wasn’t important to have live updating of the translations) The app worked but was clunky, ugly, buggy and had little buy in from anyone but IT. I could think of many things I might improve on it.

This was a bit of a ramble. But after talking about what I’ve done and worked on. What do you guys do?

This post is also available on DEV.