Among all the things that AI programming can do, the simplest and most suitable for beginners is to create small tools or games with pure HTML pages. AI generates .html files, which can be opened directly in a browser by double-clicking.
Trae has released a Windows version, and I remembered that my Mac computer has been collecting dust for almost a month. I felt that it was far from being as good as cursor/windsurf after testing it on the first day, so I hadn’t used it again. But since it’s a free Claude API, let’s test it again.
So, I casually wrote the small tool below.
I think this small example is more enlightening in terms of the value of home-cooked software.
Finding a website that generates similar images may not be difficult, but what if you want to add a watermark to the image? What if you want the image to read your notes? What if you want to replace the subtitles with a specific alien language?…… And, can it be free? The more niche the demand, the more one can feel the value of AI programming.
The prosperity that AI programming is about to bring is not the prosperity of software engineering itself, but rather how it satisfies long-tail demands, which in turn brings prosperity to all related fields.
I saw many subtitle screenshots in an article recalling the Legend of Nezha this morning.
Using this method to turn what you want to say into an image seems to fit the reading habits of public accounts quite well. Wishing, wishing, Trae help me write a small tool……
1, 2, 3, open your eyes……
The process is very simple👇
Paste the image to Trae and clearly write your requirements:
Click the application in the top right corner. Then find it in the folder, double-click to open in the browser, and test it.
The effect was not quite right; the generated image below overlapped with the previous image~~
Paste the result to the AI, describe the erroneous phenomenon and the expected performance. Let the AI iterate again. The first modification made the program worse, possibly because it forgot what the original requirement was. So I pasted the initial image for comparison. This time it succeeded.
There was still a small problem, so I modified it again.
After three rounds of dialogue, it was finally done. Next, I added a save function.
Then I adjusted the details:
The last few steps are something that programmers would prefer to code directly. But when testing functionality, it’s necessary to test everything to see if a technical novice can handle it. The experiment went smoothly.
Yes, it’s that simple.
Reply “subtitle image” on the public account to get the source code. Save it as an .html file, and you can use it by opening it in a browser.
END
Unheard Code·Knowledge Planet is open!
One-on-one Q&A for web scraping-related questions
Career consulting
Interview experience sharing
Weekly live sharing
……
Unheard Code·Knowledge Planet looks forward to seeing you~