AI Artifacts & Generated Sites

Vibe Coding

Definition

The term describes a way of working, not a technology. You state the goal, the assistant writes the code, you run it, and you feed back what was wrong — the button is in the wrong place, the totals do not add up, make it work on a phone. The code is read selectively or not at all, which is the part that separates vibe coding from ordinary assisted programming. It works well for small, self-contained, visual things where running the program tells you immediately whether it is right: a calculator, a dashboard, an internal tool, a prototype to argue about. It works badly where correctness is not visible from the outside, which covers most of what people mean by production software.

Why It Matters

The method is genuinely fast, and the speed is worth taking seriously — a working interactive prototype in twenty minutes, by someone who could not have written it at all, changes what gets tried. The failure mode is just as real. Code nobody has read can be subtly wrong in ways the demo never shows: an edge case that rounds the wrong way, an input nobody thought to type, a key sitting in plain text in the source. Two rules keep it honest. Never vibe code the part that handles money, personal data or authentication, and never publish a page whose source you have not at least skimmed for secrets.

How It Works

Ask for the whole thing in one file to begin with — one HTML page with the styles and script inline — because a single file is easy to run, easy to read and easy to publish. Iterate in small, testable steps and say what is wrong rather than how to fix it; the model is better at the second than you might expect and you stay out of the details. Keep a copy of each version that worked. When the result is right, save the page as index.html and upload it to a static host: the browser runs it exactly as it ran in the chat. If the thing you described needs a login, a database or a scheduled job, no amount of iterating will make it run as a static file — that part needs a server, and the usual compromise is to keep the interface static and call out to a service that does run code.

Real-World Example

An operations lead describes a shift rota tool: a week grid, drag names between slots, warn on double bookings. After nine rounds the page does all three, at about 40 KB. She uploads it to 99helpers as rota-tool and sends rota-tool.99helpers.site to her team. The warning logic turns out to miss overnight shifts, which nobody noticed in the chat and everybody noticed in week one — the honest illustration of what vibe coding is and is not good at.

Common Mistakes

  • Judging the code by the demo alone — the demo only exercises the path you happened to try, and the interesting bugs live everywhere else
  • Letting the file grow past a few hundred lines in one conversation — later rounds start undoing earlier ones, and neither you nor the model can see it happening
  • Vibe coding anything that touches payments, passwords or personal data — here the cost of an unread line is not an embarrassing bug but a breach
  • Publishing the first version that works without reading the source for hardcoded keys, test data or a stray link back to an internal system

Related Terms

Put a file online in seconds

Drop in a document, an image, a page or a whole static website and share the link — free, with no build step and no server to set up.

Host a file free →