DEV Community

Cover image for Integration for Angular: Automated Translations with doloc
Daniel Schreiber
Daniel Schreiber

Posted on • Edited on

3

Integration for Angular: Automated Translations with doloc

Developing multilingual apps efficiently can be a real challenge - especially when working with various frameworks and tools. This is where doloc comes into play: a lightweight solution for automated translations that integrates seamlessly into your existing workflows. The focus is on great translations and no need for a glossary, as all texts automatically serve implicitly as a glossary.

Today, we’re excited to introduce our latest integration for Angular!

In this article, we’ll show you how to use doloc to automate translations in your Angular project and save valuable time. It takes you only three steps before you can extract and translate your texts automatically!

Angular: Automating Translations with doloc

  1. Set up Angular Localization i18n with the official Angular guide.
  2. Set up ng-extract-i18n-merge to manage translations.
  3. Add doloc to your workflow by adding the following to your package.json script:
{
  "scripts": {
    // other scripts ...
    "auto-translate-fr": "curl https://api.doloc.io -H \"Authorization: Bearer $API_TOKEN\" --data-binary @src/messages.fr.xlf -o src/messages.fr.xlf",
    "auto-translate-it": "curl https://api.doloc.io -H \"Authorization: Bearer $API_TOKEN\" --data-binary @src/messages.it.xlf -o src/messages.it.xlf",
    "update-i18n": "ng extract-i18n && npm run auto-translate-fr && npm run auto-translate-it"
  }
}
Enter fullscreen mode Exit fullscreen mode

The $API_TOKEN can be found in your doloc account.

Now run npm run update-i18n to extract new translations and automatically translate them.

To find more info and details for configuration follow our guide on https://doloc.io/getting-started/frameworks/angular/.

Summary

By using the Angular integration of doloc you have the following advantages:

  • Easy integration into the development workflow
  • Instant translations of texts via API
  • Consistent style without a dictionary
  • Reduced translator workload
  • Accelerated time to market
  • And, of course: Great translations!

Leave a comment or send us a message in case you need help or you have questions!

P.S. This also works for many other formats and frameworks!
Be sure to check out our guides for Android and FormatJS/react-intl.

Redis image

Short-term memory for faster
AI agents

AI agents struggle with latency and context switching. Redis fixes it with a fast, in-memory layer for short-term context—plus native support for vectors and semi-structured data to keep real-time workflows on track.

Start building

Top comments (0)

Dev Diairies image

User Feedback & The Pivot That Saved The Project ↪️

We’re following the journey of a dev team building on the Stellar Network as they go from hackathon idea to funded startup, testing their product in the real world and adapting as they go.

Watch full video 🎥

👋 Kindness is contagious

Dive into this thoughtful piece, beloved in the supportive DEV Community. Coders of every background are invited to share and elevate our collective know-how.

A sincere "thank you" can brighten someone's day—leave your appreciation below!

On DEV, sharing knowledge smooths our journey and tightens our community bonds. Enjoyed this? A quick thank you to the author is hugely appreciated.

Okay