Dwarves
Memo
Type ESC to close search bar

Continuous Translation

Continuous Translation (CT) is a modern approach to translation management that involves synchronizing software development and translation workflows. This means that developers, translators, and product owners work together in a continuous cycle to ensure that all translations are up-to-date and aligned with the latest software developments.

Unlike traditional translation workflows, Continuous Translation eliminates the need for file and space synchronization between different stakeholders, streamlining the translation process and promoting better collaboration. By implementing Continuous Translation, companies can achieve faster development cycles, higher-quality translations, and a better user experience for their customers.

Working with localization

How localization generally works

The classical or typical approach in any software project will have translated data be coupled with the repository (plus its software release) and its access to the data. This data could exist in a database or directly as a file. Changes to the data would be dependent on the coupling of the git repository and the translation management system, which becomes a blocker for translation teams.

Alternative solutions to localization

In order to reduce the friction between the developing team and the translation team, we can remove data and process coupling between systems of both teams by centralizing the data to allow for continuous translation. In this article we’ll discuss 2 possible solutions to integrate continuous translation into our current system:

Solution 1: Google Sheets

Google Sheets is a free and easy-to-use tool that allows us to manage translations with all stakeholders. Before deploying the app, developers can use Git actions to fetch the latest version of the Google Sheets and generate the locale translation files.

Here are what the steps to use Google Sheets would look like for managing translations:

Step 1: Create a Google Sheet that contains all supported translation items. Here is an example template you can use. Step 2: Fetch data from Google Sheets using the following code:

Make sure to replace the ***sheetId*** and ***sheetName*** with your own values

// Save on './public/spreadsheet.ts' file
const sheetId = "<Sheet-ID>";
const sheetName = "<sheet-name>";
const baseUrl = `https://opensheet.elk.sh/${sheetId}/${sheetName}`;

// Path to store all translation data
const translateDataPath = "./public/locales/translate-data.json"; 

export const getJsonData = async () => {
	const res = await fetch(baseUrl, {
		method: "GET",
		headers: {
			"Content-Type": "application/json",
			accept: "*/*",
			authority: "opensheet.elk.sh",
		},
		mode: "cors",
		credentials: "omit",
	});

	if (res.ok) {
		return await res.json();
	}
};

getJsonData().then((data) => {
	const fs = require("fs");
	let myObject = data;

	// Writing to our JSON file
	var newData = JSON.stringify(myObject, null, 2);
	fs.writeFile(translateDataPath, newData, (err) => {
		// Error checking
		if (err) throw err;
		console.log("New data added");
	});
});

**Step 3: **After having obtaining the translation data, generate locale files for supported languages using the following code:

// Save on './public/manage-translations.ts' file
import path from "path";
import fs from "node:fs/promises";
import fsExtra from "fs-extra";
import _ from "lodash";

import dotenv from "dotenv";
dotenv.config({ path: ".env.local" });
dotenv.config({ path: `.env.${process.env.NODE_ENV}` });
dotenv.config();

const validLang = ["en-US", "de-DE", "fr-FR"];
const defaultLanguage =
	process.env.LOCALE == null ? "en-US" : validLang.includes(process.env.LOCALE) ? process.env.LOCALE : "en-US";

const configs = {
	defaultLanguage,
	otherLanguages: validLang.filter((lang) => lang !== defaultLanguage),
	rootExportPath: "./public/locales",
};

const allLocales = [];

async function generateJSONFiles() {
	const data = await fs.readFile("./public/locales/translate-data.json", "utf8");
	const jsonData = JSON.parse(data);
	const locales = Object.keys(jsonData[0]).filter((key) => key !== "elementId");
	const result = locales.map((locale) => {
		const data = {};
		jsonData.forEach((item) => {
			data[item.elementId] =

Solution 2: Use a translation management platform

For this approach, we can use Locize as our continuous localization management platform. This approach isn’t limited to Locize, but the idea is to have a platform to decouple software release from the translation work and minimize work friction for translation.

Locize has integration support for a variety of frontend systems. You can integrate Locize by following steps:

There are three ways to use Locize in your app:

Do not use this option if you have a serverless environment as it can generate too many download requests and run up your bill.

Comparisons between solutions

Solution 1 recommends using a custom translation file and providing translations for each language in a separate JSON file. The translation file is then loaded on the server side and used to render the content in the appropriate language. This solution is relatively simple and straightforward to implement, but it can become cumbersome to manage as the number of languages and translations grows.

Solution 2 proposes using a translation management platform, with one example using Locize, which allows for continuous localization management. This solution involves integrating Locize into the application, synchronizing the existing translations with Locize, and then bundling the translations in the application using one of three different possibilities, depending on the specific use case. This solution requires more setup and configuration but can provide a more scalable and streamlined approach to managing translations.

In summary, Solution 1 is a simpler and cheaper approach to manage translations, while Solution 2 is a more advanced solution that provides more flexibility and scalability in managing translations.

Pros and cons when integrating Continuous Translation into your app

Pros

Cons

Conclusion

Multilingual support is a very important function for web or mobile applications nowadays. Users will come from all over the world and always ask for support for their language. The two options above have different advantages and disadvantages, so you need to consider the exact scope of the product to have the best choice for your team. Both methods can meet the needs of constantly translating products to support new features or new products, but it will cost production as well as quality assurance.