URL2OG - An Exercise in Vibe Coding
What's OpenGraph Anyway?
It's a standard defined by Facebook back in the day on how a website can specify how it looks when shared on social media. These metadata tags, along with some originally intended for Twitter, seem to be the main way to declare your appearance on social media.
In addition to a title and description, a pretty important part is an image representing that particular page. For the most part, I've just not done anything, but if I could be bothered, I'd either create a terrible-looking collage in Gimp or use some sort of AI tool to generate some abstract image I could just plaster on every page - not an ideal solution.
Meet url2og: A Simple Solution
A week or so ago, I read a post by @levelsio on X describing a service he vibe coded in a couple of hours that just takes a screenshot of a particular URL at a popular resolution. A great idea, I thought, and went ahead to do just the same.
How I Built It: The Fun Part
Now, I just created a new directory, initialized git/npm in it, and opened cursor, telling it what I wanted. Things worked great, and in about an hour and a couple of prompts, I got a working service. Over time, I've modified minor nitpicks I've noticed.
The Not-So-Perfect Side of Vibe Coding
One thing that for now is holding back vibe coding considerably is the over-agreeable nature of most LLMs. They are meant to be assistants to you, not to question your decisions, which leads to terrible results when vibe coding.
Generally, the LLM did not help at all when it came to creating a secure/efficient service like this. I generally had to specifically ask it to restructure things in a certain way, or at least tell it to, for example, review the codebase for security issues and harden it at least somewhat. Same for the domain whitelist (it'd have happily let me deploy a service that would just send requests to any server on the web).
Wrapping It Up: What I Learned
Well, apart from that minor excursion, things worked really great. When you pretty much know exactly what you want and just use the LLM for its superior speed in typing out the actual code and knowing how the framework du jour wants you to specify the various endpoints your service needs, then things work excellently.
Now, if you need a service like this as well and are even lazier than I am, then you can just fork/clone everything over on GitHub.
Adios, べン