Translator Helper - A VS Code Extension to help you translate documents

Translator Helper is a VS Code Extension to help you translate documents. It is easy to use. Just press Alt+T. The text will be automatically translated to another language and inserted after the current text as expected.

Introduction

Microsoft Docs is the new generation of Microsoft’s tech documentation to replace MSDN. It provides bunches of tutorials, API reference, code examples and best practices for users, developers and IT professionals. But for non-English users, one issue is some documents are translated by machines without proofreading, which means the readability is not good enough.

I started to be involved in the Chinese-localization of docs since 2017 by proofreading the auto-translated contents. All the contents of Docs are hosted on GitHub so we can easily fork the repositories and make changes then push the PRs. In this period, I developed a VS Code Extension which can significantly improve the efficiency of the proofreading. I just got spare times on holiday so I published it to the marketplace after adding the icon and refactoring some codes. In this article, I will introduce this extension and I hope more and more developers would take part in the localization of Docs to provide more high-quality localized contents.

The file type of Docs is markdown. I prefer to use VS Code to edit markdown files. Before I had this extension, when I proofread the documents, I usually select the whole paragraph and copy & paste it to Google translate, then copy the translated text and paste it back to VS Code. I compare the results from Google and the machine-translated contents of Docs and manually edit them by proper text. But the select-copy-paste action is quite tedious. Can we have tools to simplify it? I have tried lots of extensions related to translation in the marketplace but none of them can easily implement this process. So I had to write it myself. The best thing is VS Code has good documents regarding APIs. I just spent a couple of hours to implement the main functionalities. Now, I can press Alt+T to translate the whole paragraph automatically and no need to copy & paste text between VS Code and Google Chrome anymore.

Installation

Search translator helper in VS Code Extension Marketplace as shown below:

Click install to install it.

Configuration

By the default configuration, Translator Helper calls Google Translate API to translate the text. For Chinese users, Google CN service is supported.

Press F1 or Ctrl+Shift+P to call the Command Palette of VS Code, then type settings and select Open User Settings:

You can find the configurations of Translator Helper:

There are three settings as below:

• translatorHelper.api: Specify the translation API. Available options are google, google-cn . The default value is google.
• translatorHelper.sourceLanguage: Specify the source language code. The default value is en.
• translatorHelper.targetLanguage: Specify the target language code. The default value is zh-CN.

The source and target languages are identified using the iso-639-1 codes. You can find all the supported languages here: https://cloud.google.com/translate/docs/languages.

Usage

After specifying correct languages, we can start to use it. Open the file and place the cursor in any position of the paragraph you need to translate, then press Alt+T. The whole paragraph will be selected automatically then the translated text will be inserted after the paragraph, as shown below:

The translated text will also be selected so you can easily copy & paste it anywhere. The result from Google Translate is quite precise so we just need to adjust some words.

In addition, you can translate words or sentences. Select a word or a sentence, then press Ctrl+T, the translated text will be shown on the status bar. You can also easily copy the translated text to the clipboard by clicking it.

That is it!

Summary

Translator Helper is a simple VS Code Extension for my specific scenario which indeed improves my productivity regarding docs translation. My next step is to support Microsoft Cognitive Service. If you are interested in it, welcome to join me to improve it. Also, I will write an article to introduce how to develop a VS Code Extension such as Translator Helper. Please continue to follow my blog if you are willing to develop your own extension. Thanks.