Coding is more popular than ever, but the overwhelming majority of languages and frameworks are all designed for English users. We wanted to make a way for people to learn to code in their parent tongue, and so we made Flython.
What it does
Flython provides a platform for anyone to learn to code from a programming language modeled after the language of their choice. We provide a Python-based IDE that allows users to convert and run code between a wide selection of linguistic contexts. For a truly immersive experience, users can also view and search documentation in their native language.
How we built it
For multilingual translation, we first wrote a custom Python script for performing tokenization. We used the Google Cloud Translate API to translate built-in functions and keywords as well as the documentation and modules of several popular libraries. A similar workflow was also employed to enable the automatic translation of code comments.
Our front-end was built in React.js and uses a React component package for the editor. We custom-built a syntax highlighting feature for translated languages. The interactive shell was constructed using xterm.js.
Challenges we ran into
We realized early on that creating an online coding environment, let alone one that can switch between multiple different languages, would pose many interesting technical challenges. Whereas we were fortunate to find several packages that made setting up an editor easier, linking our editor to an online shell presented a unique situation that we had to find several workarounds for.
With regards to the backend, we anticipated translating code to be a difficult task, and we indeed devoted a substantial amount of time to setting this up. Because many functions have complex naming schemes that require additional processing before input to a translation API, we also were pushed to explore context-based translation procedures powered by documentation.
Accomplishments that we're proud of
We built an online IDE from scratch, and we paired it with a robust translator for translating programming languages. Being able to swap between arbitrary language pairs while coding was pretty cool, and we're proud of the design that we came up with.
What we learned
We gained a decent amount of experience in building online coding environments. We also learned a good amount about compilation and tokenization, particularly in the task of recognizing different syntactical objects. We also taught ourselves how to traverse and retrieve documentation, as well as how to make use of translation APIs.
What's next for Flython
We're looking forward to exploring many options in the future. Besides performing necessary quality checks on our translations, we have many other plans. First off, we plan to add standard editor features such as linting and multi-file support. The shared basis of Python as an executing language and our well-defined mappings would also facilitate collaboration between users of different linguistic backgrounds, which we believe will be an extremely interesting application. Given our experience in code translation from this project, we would also like to take a look at offering other languages as bases for localization.