Vibe coding is magic, but you still need to go to Hogwarts

(8 minute read) Four skills you need for effective vibe coding

Photo by Aditya Vyas on Unsplash

👋🏼 Welcome to A Founder’s Life for Me (FLFM). I’m Alek, a repeat founder. I’ve built and sold one company so far. I share what I’ve learned in 5-minute reads.

Vibe coding is magic, but you still need to go to Hogwarts

Vibe coding won’t magically build your app for you — it’s a skill you can learn.

Many people think of “vibe coding” as a magical new age of computer programming where all of your code is generated for you. That’s only partially true. It is magical, but you need to learn new skills to effectively use it.

Vibe coding is “a programming approach that uses an AI large language model (LLM) to generate functional code from natural language prompts.”

I’ve been using GitHub Copilot for AI-assisted programming for the last two years now (subscribed in August 2023). Here are four skills you need to master to magically build apps with vibe coding:

1. “Divination” - Develop AI foresight

2. “Potions” - Select the right ingredients

3. “Transfiguration” - Choose the right words

4. “Defense Against the Dark Arts” - Focus on what matters

1. “Divination” — Develop AI foresight

Let me share some context to help you understand what I mean by “AI foresight.”

I’m currently building a personal financial planning desktop app, “Solidly Finance.” In the current flow of the app, you create a ‘Debt’ with a name and description. For example, you might load in the mortgage on your house.

After you create the mortgage, you can open it and add the details (e.g., the principal and the interest rate of the loan). Early users found this flow confusing. So, I’m consolidating the two steps into one and using AI to do it.

There are a few different ways I can ask the AI to handle this feedback:

1. Send prompts where I expect the AI to generate >500 lines of code. In GitHub Copilot this often falls into a setting called “Agent mode.”

   1. “Users found it confusing that the debt’s details are added after the debt is created with a name and a description. Please address this feedback.”

2. Send prompts where I expect the AI to generate <500 lines of code. In GitHub Copilot this often falls into a setting called “Edit mode.”

   1. Backend prompt: “Let’s merge these two API endpoints together so the user can create a debt and add the interest rate at the same time.”

   2. Frontend prompt: “The backend now allows for an interest rate to be added alongside the debt creation. Please update the frontend form to support this as well.”

3. Send prompts where I expect the AI to generate <50 lines of code. In GitHub Copilot this often falls into a setting called “In-line edit mode.”

   1. Backend prompts:

      1. “Add a section to this API endpoint that checks if an interest rate is provided. If so, add it to the debt.”

      2. “Add a section to this API endpoint that checks if a principal is provided. If so, add it to the debt.”

      3. … continued for each change I want made to the backend code.

   2. Frontend prompts:

      1. “Add a field that allows the user to enter an interest rate.”

      2. “Add form validation to confirm the interest rate is a number between 0% and 100%.”

      3. … continued for each change I want made to the frontend code.

There isn’t a way to be 100% confident in the outcome of any vibe coding prompt. If you only ask the AI to perform small tasks, it is more likely to execute each task correctly but you need to invest more thought and time. If you ask the AI to broadly address the feedback, the AI may spin for five-to-ten minutes only to make changes that don’t align with how you want to solve the problem. These changes are easy to revert, but you’ve waited five minutes and not made any progress.

In this case, my divination instincts tell me to go with approach #2. But, this isn’t a one-size-fits-all solution. In my experience, frontend development is where vibe coding shines and you can get away with broader prompts. Backend logic usually depends heavily on business rules, database schemas, and application-specific quirks that an LLM can’t fully intuit from a single prompt. Backend development requires higher specificity and more targeted asks.

2. “Potions” — Select the right ingredients

Every good potion starts with the right ingredients, and in vibe coding, those ingredients are the files, snippets, and context you give the AI. If you leave something out—or toss in the wrong thing—you won’t end up with the outcome you wanted.

Once I’ve divined how broad of a prompt I’ll give the AI, I think about what ingredients I need to brew the right result. In the example above, that means pulling together four files:

1. The frontend code for the debt name & description form

2. The API endpoint that receives the name and description data

3. The frontend code for the interest rate and principal form

4. The API endpoint that receives the interest rate and principal data

Give the AI the wrong ingredients, and you’ll likely get the wrong outcome. This is where your skills as a developer matter: you need to know your codebase well enough to grab the right components and present them clearly.

This is also where experienced developers shine with vibe coding. They know which files to pick, and which to ignore so the AI can create a working solution. If your codebase feels messy, spend some time with the AI reorganizing it into a structure that makes sense. Like a potions master labeling jars, the better organized your code is, the easier it is to concoct the right context.

3. “Transfiguration” — Choose the right words

“Words are, in my not-so-humble opinion, our most inexhaustible source of magic.”

- Albus Dumbledore

Transfiguration is about transforming one thing into another without losing control of the outcome. In vibe coding, the same principle applies. But instead of using spells to change animals into goblets, we’re using prompts to change ideas into code.

The clearer and more structured your prompt, the more likely the AI will produce code that fits. For example, instead of writing:

“Make the form better.”

You’ll get far more useful results if you ask:

“Add validation to confirm the interest rate is between 0% and 100%.”

I have found it useful to experiment with broad prompts like “Make the form better,” just to see if the AI opens my eyes to new outcomes that I hadn’t envisioned. But, if you’re addressing specific user feedback or pushing your app forward, being precise with your words goes a long way to getting the outcome you want.

4. “Defense Against the Dark Arts” — Focus on what matters

Defense Against the Dark Arts is about protecting yourself from dark magic. In vibe coding, “dark magic” doesn’t come in the form of curses or dementors — it comes as distractions. Here’s an example:

1. I set out to consolidate two forms, as I showed you in my example above.

2. During testing I notice that the loading spinner is slow to appear after I submit the form.

3. I wonder “Why is that taking so long? Can I fix it?”

4. I deep-dive into the loading spinner issue and figure out the problem.

5. I decide to make it more responsive and work with the AI to do it.

6. I decide to check if the same issue exists elsewhere in the app... It does.

7. I spend time resolving the loading spinner issue everywhere across my app.

8. Thirty minutes later… I’m on top of the world! I’ve implemented the new and improved loading spinner everywhere! Mission accomplished!

9. I go back to my to-do list and remember that I was supposed to be consolidating two forms, not tweaking the loading spinners. Womp.

The curse of vibe coding is that every little improvement feels just a quick prompt away. You need defenses to protect yourself from this temptation. For me, my Patronus charm comes in the form of a clear to-do list. Instead of chasing every problem I stumble across, I jot it down — “investigate loading spinner delay” — and move on. That way I can return to it when the time is right and stay focused on what matters.

Vibe coding is magic, but you still need to go to Hogwarts

Vibe coding is magic, but it won’t build your app for you. It’s a magical skill you can learn. And, the four skills you need to harness this magic are:

1. Develop AI foresight

2. Select the right ingredients

3. Choose the right words

4. Focus on what matters

For me, the fastest progress has come from practicing these skills on real projects. So, if you’re curious about vibe coding, don’t wait for your Hogwarts letter — start a small project! Experiment with different prompts, try varying levels of context, and learn where the AI shines and where it stumbles. Each attempt builds your skills, and those skills are what matter most.

Thanks for reading! Subscribe below to stay tuned! By sharing my experiences, I hope to provide advice to entrepreneurs facing similar challenges. Feel free to email me with any questions, or if you’re interested in trying the Solidly Finance app!

Related Articles

If you are new to coding and don’t even know how to get started, try reading “How to Teach Yourself to Solve Problems Using Code.” There, I give a more tactical guide and advice for non-coders. If you’re not interested in writing code yourself, it should help demystify what “coding” means. If you want to learn more, give it a read!

How to Teach Yourself to Solve Problems Using Code