Lesson 2: What Is Vibe Coding?

What actually happens when you vibe code

When you type "build me a quiz app" into Lovable or Replit, a large language model (the same family of AI as a chatbot) writes hundreds of lines of real code: the layout, the buttons, the logic, the storage. The builder then runs that code instantly and shows you a live preview. You are the director. The AI is a very fast, very literal junior developer who never gets tired and never gets offended by feedback.

⚠️ The two vibe coding traps

Trap 1: vague prompts. "Make it better" gives the AI nothing to aim at, so it guesses, and its guess is usually not your taste. Trap 2: asking for 6 changes at once. The AI will attempt all 6, tangle them together, and you will not know which change broke the app. One clear instruction per message wins.

The anatomy of a build prompt

Your first message to any AI builder matters most: it sets the foundation. Strong build prompts have 5 parts. You already wrote parts 1 and 2 in Lesson 1.

Here is the difference the 5 blocks make, using the football team example from Lesson 1:

❌ Weak prompt (the AI has to guess everything)

Make an app for my football team.

✅ Strong prompt: all 5 blocks

Build a web app for my school football team's parents, so they can see match info without calling anyone.

Screens:
1. Home: a list of upcoming matches, each showing date, kick-off time, opponent, and venue. The next match is biggest, at the top.
2. Add Match: a simple form (date, time, opponent, venue) with a Save button.
3. Team: player first names and positions in a grid.

Actions: tapping a match opens its details. The Add Match form must not save if any field is empty; show a friendly error instead.

Look: dark navy background, lime green accents, big rounded buttons, bold headings. Must look great on a phone.

Data: store matches so they are still there after the page is refreshed.

💡 Say the look in feelings AND facts

"Look: fun" is weak. "Dark navy, lime accents, big rounded buttons" is strong. If you cannot name colours, name a mood plus an example: "calm and clean, like a weather app". The AI matches specifics far better than vibes alone, even in vibe coding.

Iteration prompts: the other half of the skill

After the first build, you go around the loop with small, surgical messages. Save this pattern; you will use it hundreds of times:

✅ The fix-it pattern

When I [do this action], I expected [what should happen], but instead [what actually happens]. Please fix only this, and do not change anything else.

Three real examples of the pattern at work:

"When I save a match with an empty venue, I expected an error message, but instead it saves a blank match. Fix only this."
"When I open the app on a phone, I expected the match list to fit the screen, but instead I have to scroll sideways. Fix only this."
"Make the Save button twice as large and mango orange. Change nothing else."

Check your understanding

Your app's quiz screen shows the wrong score. Which message is the best vibe coding move?

Correct. It names the action, the expected result, the actual result, and limits the change. That is a bug report a machine (or a human developer) can act on precisely.

✅ Lesson 2 checklist

I can say what vibe coding is in one sentence, to a parent, without the word "magic". I memorized the loop: say it, AI builds, try it, fix ONE thing. I wrote my own 5-block build prompt using my Lesson 1 promise and sketch. My prompt names the screens, the actions, the look, and what data gets saved. I copied the fix-it pattern somewhere I can reuse it.

Finishing this opens Lesson 3: your first real build, on Lovable.