How to get translations on frontend side?

So a question: your front-end is something like React or Vue, that renders pages, or is the page a rendered HTML by Elixir (Phoenix or LiveView) and then you sprinkle JS on top of that?

If it’s the later then you should not have to do anything really, if it’s the former then it may be more complicated.

@hubertlepicki Actually it is the first option, to use translations in Vue and not to have duplicates.

Yesterday founded this lib - GitHub - change/linguist: Elixir Internationalization library · GitHub for transaltions which is actually the standard i18n, so maybe I will use this one instead of gettext, because transforming yml to json is much easier than parsing .po, .pot files.

You can try, I never did, but I used i18next for JS files.

Honestly I think the easiest would be to keep these two systems separate.

Parsing .pot files is really easy. You can even use this library expo which is what gettext elixir library uses.

Expo.PO.parse_file!("./priv/gettext/default.pot")
|> Map.fetch!(:messages)
|> Enum.map(fn message -> %{message.msgid => message.msgstr} end)

@hubertlepicki Yes, but it might bring some duplication.

@Adzz Yes, but I need not only parsing but also format to consumable json format for any i18n js library.

What’s the format? That wont be hard either.

@Adzz To be honest I was thinking that there is already existing solution for this.

From my pov there is no standardization for how those files are structured. Each library seems to bring their own. Also most js libraries seem to like the idea of identifying translations by arbitrary keys whereas gettext doesn’t use any keys.

Yes, looks like you are right. Thank you!