Making React apps multilingual without rewriting existing components

Making React apps multilingual without rewriting existing components

Lingo.dev auto-translates UIs at build-time 

Lingo.dev is the company behind an AI localization engine that enables developers to “translate apps, websites, and entire databases” using the latest, greatest LLMs.

The core of the product is an API that abstracts the complexity of handling LLMs and translation workflows, making it easier for devs to automate localization. The API can be accessed locally via the open-source Lingo.dev CLI, or integrated directly into their CI/CD pipelines (e.g. via GitHub or GitLab). The underlying engine automatically translates a piece of text the moment a code-change is committed, with developers receiving a pull request with the update instantly.

The Lingo.dev engine combines LLMs from multiple providers, including Anthropic and OpenAI, selecting the best model for each task and target language – since certain prompts and languages perform better with specific models, this approach optimizes translation quality and efficiency.

However, the company has just released an interesting new tool in the form of the Lingo.dev Compiler, which promises to translate React UI components without having to tamper with the source code at all. 

For context, a fully-featured web app might have hundreds of buttons, banners, menus, and more, making internationalization (i18n) a real minefield – especially where dozens of languages are involved. Normally, this involves setting up i18n libraries like React-Intl or i18next, wrapping every piece of user-facing text in translation functions, extracting all text labels into separate JSON files, and more. 

The Lingo.dev "zero-refactor” approach, on the other hand, means developers don’t need to restructure or rewrite their existing code to enable localization. The Compiler scans an app’s Abstract Syntax Tree (AST) during the build process, and identifies "translation scopes" that should be translated together to preserve the context and keep the meaning clear. By doing this, the compiler makes sure translations are accurate and fit naturally in the app, preserving how the text was originally set out.

In short, it’s all about automating what is traditionally a very manual, error-prone facet of software development, with its developer workflow and LLM integrations showing how AI can be embedded seamlessly into standard developer processes.

Lingo.dev co-founder Max Prilutskiy says that while this approach was technically feasible prior to LLMs, it was “practically useless” given that manual processes were still integral to the translation process.

“You'd still need human translators familiar with the product domain for precise translations,” Prilutsky said. “However now, with context-aware models, we can generate top quality translations automatically. That's why compile-time, AI-powered localization isn't just possible – it's becoming the most practical approach.”

Moreover, as an open source tool available under a permissive Apache 2.0 license, developers aren’t tethered to Lingo.dev’s own localization engine – they can use their own API keys and plug the Compiler directly into OpenAI or DeepL, or whatever their in-house translation stack happens to be.

While reaction from the community has generally been positive, the usual gripes around the quality of machine translation prevailed. One respondent on Hacker News begged Lingo.dev not to use auto translators, noting that “there’s nothing worse than an half-assed translation that was obviously made by a machine.”

Prilutskiy responded to say that it’s this exact scenario that Lingo.dev wants to address, by ensuring that the AI is given enough macro- and micro-context for the translation. 

Meanwhile over on Reddit, one user pondered that because the localization takes place at build-time, end-users might not be able to switch languages in the app. Lingo.dev confirmed that internationalization dictionaries are baked in, meaning that all the language options are available without having to rebuild.