For the past months I have been learning Mandarin Chinese, and in my quest to master this new language, I found that something was missing: a simple and elegant Chrome extension to translate Mandarin Chinese to Pinyin, and more.
![](https://cdn.prod.website-files.com/6472228357c3aae42379e220/647cbe3d113e2327cd0c9066_chinese-new-year.webp)
Relevant Context
Learning a new language is always a challenge, and as a Computer Science student with a deep love for language learning, I decided to develop a Google Chrome extension to make the learning journey of all the 学生 (students) easier. The goal was to create a translation tool that can translate :
- English to Chinese / Pinyin (ex. "Hello, I am a student" ⇆ "你好,我是学生 / Nǐ hǎo, wǒ shì xuéshēng")
- Chinese to Pinyin / English (ex. "你好,我是学生" ⇆ "Nǐ hǎo, wǒ shì xuéshēng / Hello, I am a student")
- Pinyin to Chinese / English (ex. "Nǐ hǎo, wǒ shì xuéshēng" ⇆ "你好,我是学生 / Hello, I am a student")
This extension aims to make browsing the web for language learners effortless.
![](https://cdn.prod.website-files.com/6472228357c3aae42379e220/647512baedd36ab84f3dacbe_bullseye-arrow.webp)
Details
The extension will be built using JavaScript for the logic, HTML, and CSS for the popup interface, and Google Cloud Translation API for the translation functionality.
Upon the user selecting text and pressing control, the extension will capture the selected text and send it both to the Google Cloud Translation API and to a database of my creation. If the text is available in the database, it is displayed to the user. If not, the API then returns the translated text, which appears to the user in a separate popup window.
The extension will also keep a record of all the translated text for user data analysis.
For storing translation history and other user data, I plan on using the Chrome Storage API which allows extension developers to store, retrieve, and track changes to the user data.