Behind

Developing a Global Version Website with GPT & Copilot

When developing a website, you might focus solely on your native language, but if you're offering a globally sellable SaaS service, something feels lacking. However, going all out for a global launch can be more demanding than expected. Our team has found a way to develop comfortably in our native language while also supporting global needs, as outlined below.

Translation Completed in the Editor

Drawbacks of Variable Handling

Typical i18n libraries handle multiple languages as follows. There are several methods, but the basic structure is as follows: creating a key for each message and displaying it in the user's language. At first glance, this seems like the most reasonable method.

This method represents the simplest form of running a multilingual version. It has the advantage of being able to flexibly add various languages as the business grows. However, when the business is not yet at the appropriate growth stage, and the work is done by a small development team, there are transitional issues like the ones below.

While these may seem like trivial chores, they lead to wastage of scarce development resources when working on the front-end development that touches user messages.

Embedding Language-Specific Messages in Code

To minimize these inconveniences, the Videostew team develops multilingual versions at the pace of a single native language version. Instead, they limit the multilingual version to just "English." Although this approach can't be maintained as the market expands, it is very useful in the initial global phase to appeal to the user base that can use "English."

The Videostew team registers and uses a global helper called directTrans in both the backend and frontend. The implementation of this code is very simple. It takes the native Korean message as the first parameter and the global English message as the second parameter.

The section where messages are displayed to the user can simply be created as follows:

Looking at it this way, one might think you need to code and translate into English anyway, but with Copilot, that's definitely not the case. Copilot, or Cursor AI tools, can refer to helper functions you frequently use or functions defined in open tabs and input patterns, so they understand the usage of commonly used helpers very well.

When you input Korean into directTrans('.. like below, it infers that the second parameter will be the translated English message, allowing you to create a global version of the code right in the editor.

< Type in your native Korean, and automatically translated English is added >

This approach overcomes all the disadvantages of the conventional global version development mentioned above.

As mentioned earlier, this method aims to quickly implement a global version without much effort. It's not suitable for producing more refined translation quality or multiple language versions. As the service grows, the language system needs to be updated.

Asynchronous Translation of Blogs

In addition to user messages in the code, the service involves numerous messages and texts. Fixed pages like landing pages or terms can be translated once and that's it, but it's hard to manually follow up on content like guides or blogs that are dynamically created and modified.

To address this, Videostew registers guides in the native Korean language and estimates the modified parts after a certain period, translating them into English using the GPT model on the backend. While there are various API services for translation, using LLM for translation offers advantages like those below.

When it comes to large guides (almost book-length) in practical application, it's impossible to translate the entire thing with each revision. So, we create hash keys based on paragraph content and only track and automatically translate the changed paragraphs. This type of call can be more cost-effective for large-scale translation if you use GPT's bulk call discount (though we aren't using it), or you could use a cheaper model than the frontier model.

Below is the address of this blog post available in both Korean and English. The English version is a result of GPT's automatic translation, considering the characteristics of our service.

Customer Support Response

To ensure a perfect, consistent customer experience and real-time user information integration, we use our own chatbot. If a user's information is not in their native language, we automatically append the native language to show alongside the original. When we respond in the native language, it is then translated back into the user's language for delivery.

< Questions not in the native language are auto-translated both ways >

This reduces delays due to translation and allows us to provide seamless global service.

Conclusion

I understand that many services have already adopted GPT in their development and operations. For small teams like Videostew, using AI tools like GPT can efficiently enable global service.