Just had my first experience using an AI (Claude Code) to write a whole program start to finish. See the result here.
The AI coding was amazing. With about 60 minutes of “work” and $5.50 I had my result. (I then spent another 30 minutes and $3 tinkering without much improvement.) It would have taken me 4+ tedious hours to do this myself and while my resulting code would probably be better, the AI code was more than adequate for my one-off needs.
A key part of this project’s success is how simple it was. It was a Python program to download some data from a Mastodon server and format it as HTML. I could just look at the HTML output and decide if it was working. I didn’t even bother reading the Python code the AI generated. If I cared more about what the system itself was doing, how the Python script worked, it would still have been useful but taken a lot more work on my part to review everything.
I’ve been using LLMs for awhile now in chat interfaces and am impressed with them, but they are clearly just stochastic parrots, text prediction machines. Claude Code felt different. It’s still mostly an LLM but it has enough of a reasoning engine in it that I could give it high level instructions and it’d figure things out on its own. That’s really impressive to me.
I don’t think AIs are going to replace human programmers entirely anytime soon. Part of why this project went so well is I have some expertise in this kind of thing, so I knew how to tell it to (say) cache all the data from Mastodon once up front and then generate HTML locally. Or to rewrite images to make them smaller. That’s hard-won knowledge from years of building systems. But the actual scutwork of looking up Mastodon APIs and remembering how to resize images in Python? Claude did that just fine.
Anyway I’m sold on vibe coding, at least for a certain kind of workaday code where you can easily inspect the output and decide it’s good enough. And you don’t care how good the code is. I’m certain there’s still plenty of need for human expertise for more important or complicated systems but this AI experience was very impressive.
The application
I took a trip to SE Asia recently and used Mastodon to share a bunch of postcards as a Mastodon thread. Now that I’m home I wanted a nice static copy of all that easy to view and share forever. There’s a bunch of Mastodon thread unrollers but I didn’t like the output of any of them.
Here’s the HTML output Claude and I produced. I’m pretty happy with it!
That’s the final output, the customer deliverable. It looks good! Even better the HTML it generated is quality. Reasonable semantic HTML, simple structure, nothing too stupid in it. That’s better than any other automated tool I’ve ever used.
There’s also the intermediate product, the Python and shell scripts it generated. Those are also pretty good. I didn’t really read them, I’m running on vibes here, but on a quick glance it looks like reasonably OK Python code that I could understand and maintain. I would not trust Claude to do more complicated things but for this straightforward task it is good.
Claude Code even thoughtfully generates and updates a README explaining what it does. You can also get it to export a conversation of your chat log, which in some sense is the “real” programming I did.
Getting the AI to write the application
I never wrote or edited any code. I did all of this within the Claude Code shell. It wrote the code. I mostly didn’t run any code either, the agent does that for you.
High level development was in two pieces: write a Mastodon downloader to a local database, then write an HTML formatter from that local data. Then a lot of iteration, particularly on the HTML portion. I’d tell it things like “change the layout so images are only one column” or “change this text to a different font and color”.
Here’s the important choices I made:
- I broke the project into two parts: download the Mastodon data from the API to local disk, then generate HTML on local disk. That’s an important pattern for projects like this, it lets you iterate on the HTML presentation much faster without spamming the API.
- I told Claude to write simple static HTML. These tools have an alarming habit of bringing in React and other Javascript garbage.
- I tried out a couple of strategies to make the pages smaller, finally settling on using downsampled JPGs. I’m not sure if Claude would have thought to suggest that, I wish I’d asked!
- About a quarter of the way into the project I thought to ask Claude to use git. It happily did so, checking in code as appropriate.
I’ve got the conversation stored away (well most of it, it got “compacted”). Here’s some key prompts I gave it:
I want to write a Python script that downloads a bunch of posts from my Mastodon account. I want it to download a single thread: my original post and all of my replies, about 100 of them. Every post contains photos or videos that should also be downloaded. I want you to keep the original JSON data from the Mastodon API and also extract everything into a simple sqlite database with columns for post timestamp, post text, and references somehow to the images in the post. the images are important!
you’ve made two errors already converting datatypes. did you make any others? think hard about the code you wrote and try to fix anything else before I run it again
now I want you to make a nice HTML view of all the posts and pictures from the mastodon thread that I downloaded. I want the output HTML to be a simple static HTML file without any javascript dependencies, no frameworks, definitely no react. it should have minimal CSS styling but something that looks nice and modern. The images are most important, I want to be sure they look good. the images have alt tags on them in the mastodon posts, those shoudl be displayed as captions. And I want you to generate all this HTML from the downloaded files, do not make any requests on the Internet like to the Mastodon API. can you do that? tell me how you will proceed before doing it so I can review.
I ran it. It only downloaded two posts: the original and one reply. but not the others. the third post is a reply to the reply, did you remember to recurse and load the thread?
can you write code to generate smaller images to save bandwidth? ie, resize the original JPGs to new JPGs which aren’t bigger than 800 pixels. I also want it so if the user clicks on one of the JPGs in the HTML view, it links to the full size image. it can just link directly to the JPG, don’t need an HTML page for each full size image. write code to generate the smaller files, alter the HTML generator to use those files, and alter the deploy script to deploy both the smaller JPGs and the originals to my server.
Some observations
Some interesting things Claude did:
- It made a couple of errors converting types from JSON output (numbers to strings, datetimes). I fixed those one at a time and got annoyed so I scolded it and told it to look at its own code and fix any other errors. It made some more changes I didn’t review, and the resulting code worked first time.
- I asked it to download a font from Google Fonts and use it locally. It tried to download it with
curl and was blocked (a security policy in the Claude agent?) So then it just wrote a Python script to download the fonts instead and ran it. It’s hacking its own sandbox!
- Its first attempt to download fonts failed, wrong URLs. It detected the errors and did something itself to find the correct URLs and ran the download a second time. That also had one error for one font variant and it realized it didn’t need it so just ignored that error.
- It got confused with HTML templates and Javascript, some sort of problem with { quoting. It sort of hacked its way into fixing it just like a junior programmer would. It got there in the end!
- It did OK with an open ended “can you think of anything to improve”. It suggested adding some good generic HTML things like ARIA tags, print CSS, lightbox view, social media sharing. It also suggested adding map integration or location tags to the posts, a very thoughtful suggestion for my travel app!
I don’t love the Claude Code UI. It’s some terminal UI thing and very chat-oriented. I think the VS.Code integrated tools like Cursor are probably better for more careful coding. OTOH this worked well for my one-off task. I like how Claude Code has a very agent-centric design, it’s actively doing things on your behalf. It’s much more like giving instructions to a junior programmer rather than having someone pair programming with you making suggestions.