The Introduction
Recently I have been working on strapi v5, this time I was given a challenging task to implement a feature that does not have any code examples yet. I had to figure it all out myself. At the time I was given this task, I did know about some basics of strapi infrastructure but the breaking changes between strapi v4 and v5 continuously haunted me throughout the journey. There were so many options and I didn’t know which one to choose, the decision between choosing entity service, document service of strapi etc. But there was one main decision that I took which I took at the last moment and it made me think about all the frustration I had faced. Here is a little story of my journey on this. I hope someone finds it helpful.
The Challenge
The challenging task was to implement the auto translate feature in strapi. This feature was supposed to work on all localized collection types in strapi, including all relations, images, components, dynamic zones being used in that collection. The purpose of this feature was to make user life easier. The aim was to take user input about a collection of data in one language and auto translate it behind the scenes. Now this process had to be so perfect because if it failed, it could easily turn the website into a useless website.
My Approach
I started with checking on how I can intercept user input and use it to create other instances in other languages as well. I chose lifecycle hooks, a choice that turned out to be too poor 😂. Honestly this was not a choice at all. At the time I chose this option, I didn’t even know there were other ways to intercept user input. Anyway I started working on it, of course I had the help of various AI tools like Grok and ChatGpt, but they were not as helpful as I was expecting. In the beginning I relied too much on these AI tools. And because of this, for the first 2 days, I was just seeing one error after another.
Initial Experience
Within these two days, I realized that the AI tools didn’t have enough information on this topic and they were just guessing their way around. So I decided to unlock my own potential 🙂. These two days made me realize that AI tools are not that good for my type of work, at least in my current scenario where things like documentation, user blogs are not enough, because that is the primary source of information for these AI tools. I’m not saying these AI tools were totally useless, they were good enough to provide me with a starting boiler plate and some sense on how I can proceed with this.
Now that I had started this, I got more and more familiar with how strapi handles things behind the scenes, allowing me to find out the potential bugs and fix them early. At this point, AI was out of options, I could only use it to generate the code that I already knew will work, kind of using AI to do the algorithm translation 😀. Now that I am writing this blog, I am not relying on AI as well as I normally do. Although I might use AI to generate some nice thumbnails or short heading 😂.
The outcome
At the end of the first 5 days, I started seeing some results. The translations were being handled properly up to some extent. So although this took 5 days for me, it was still cheerful to see some results coming out. There were some issues on how components, dynamic zones were being handled but eventually I figured it all out and it started working perfectly.
Now once it started working, a bug came up, a bug that will haunt me for more than 1 day. I got stuck in an infinite loop, the reason was the choice of “life cycle hooks to intercept user input”. But still I didn’t figure it out at that moment, I just found a work around by storing in memory keys for each translation under process to identify already translated entries and it worked. Now at this point I thought this was over, but it was not. After a few weeks, when I had to integrate strapi APIs with Nextjs frontend, another issue came up, “The content coming from APIs was not being translated”. The reason was the different structure of data. Until now, I was dealing with data coming from strapi admin panel, but the data coming from APIs was slightly different. The difference was not a bug, but a population issue, strapi does not include the data that needs population in API responses until we explicitly tell it to. Now I started fixing this error. I fixed it, faced another infinite loop issue because my work around failed at this point but I made it work anyway.
The end or the beginning??
When it worked, I thought this is the end, I do not have to spend anymore time on this challenge because all types of scenarios were covered, But here comes a plot twist that made me realize why the choice of life cycle hooks was poor. I didn’t realize this on my own though, it was Grok AI who made me realize this. The issue was in translation, let me explain the issue with an example.
The example is kind of my experience. I entered a title “Grand Palace”, now this title has been translated into other languages but it also got translated into English as well 😂. I entered “Grand Palace” but in the database I saw “Large Tent” 😂😂😂. At this point, out of frustration, I just spammed prompts on ChatGpt and Grok, and while I was spamming prompts in frustration, I found the solution, the solution was to use middlewares of strapi v5 with document service API. Until this point, I just thought middlewares were not even an option, I did some research on strapi docs, found out that middlewares are something built for this kind of work. I wanted to smash something around me, because the docs made me realize that middleware could also solve my infinite loop issue in a simpler way than what I was doing. Anyway I did what I had to and now I think it is perfect, as long as something new does not come up to haunt me.
Moral of story....
Now I could write a lot of morals about the story but I want to know what you think about this. Let me know if you have any advice for me after reading my story.
Top comments (0)