I seem to have an obsession with directories.
During COVID I helped build letsorder.delivery: a directory of local restaurants offer non-app delivery. Today I launched new one wpg.beer: a directory of local brewery taprooms.
I’m not entirely sure where this obsession comes from. Maybe it’s nostalgia for the early web — before search engines and social media, when discovery meant stumbling across a hand-curated list from someone you trusted.
What I do know is that I built wpg.beer to solve a real (albeit simple) problem, and to further my experiments in “vibe coding.”
The Problem: What the heck is open‽
More often than not, I find myself going out for a pint (or three) on a Monday or Tuesday. Taprooms (and beer gardens in the summer!) are my go-to. And as the directory makes painfully clear, early-week hours are chaotic!
Typically, this means checking 3 or 4 Instagram accounts to triple check what’s actually open. IG has become the defacto way the local independent business communicate.
In theory, the info is also on mapping apps. But maps are built around places, not questions. They’re great if you know where you’re going — not so much if you’re just asking “what’s open right now?”
Corporate tech isn’t solving this. So I built something that does.
Sidebar: Failure of the Modern Internet
The original dream of the open Internet was an open web of information, where even simple facts, like a business’s opening hours, could be freely shared and universally accessed. By now, we should have a standard protocol for this. Some agreed-upon way for businesses to publish basic details, and for users to access that data however they like.
Instead, business owners are left with a daunting task of updating two, three, four, or however many popular corporate Internet platforms their customers might use. And customers are left hoping they’ve chosen the correct platform with the most up-to-date.
We didn’t need to end up here. But I digress…
On Vibe Coding
wpg.beer was is 99% coded by Claude code.
The initial prompt was as follows:
I would like to create a web project which is directory of Winnipeg breweries.
Each brewery will have the following properties:
- Name
- Description
- Location (Both street address and map coordinates)
- Days and hours of operation
- Links (For example, official website, social media, etc)
The project should be built in Laravel With filament.
Please set up the layer of project, including filament and use whatever database schema makes the most sense. For this phase of the project, we will only have a homepage that lists all the breweries.
Claude cooked on this for at least 15 to 20 minutes. It was one of the biggest tasks that I’ve ever had Claude work on.
The results of this prompt was a fully functional Laravel application, including a CMS via the filament to install.
To my surprise and delight, it decided (i.e. unprompted) to use tailwindcss to create the the card based layout that you see on the site, it also created a database seed with data that vaguely resembled Winnipeg brewery data. I was blown away!
After this initial bit of work, I had Claude build out some more features (like the “open” status), make a few layout changes, create a background image and that sort of thing.
Aside from some configuration changes I did not touch a single line of php or css…
I recently saw somebody suggest that “vibe coding” was kind of a silly, or reductive, or useless term. They were suggesting that it’s really more like “rapid prototyping.”
But in reality, this is more than a prototype. It’s a fully functional version one of an application.
Soon everything will be “vibe coded,” and that may just be a great thing for the indie web!
Leave a Reply
Only people in my network can comment.