How to vibe code: a beginner's guide to building apps with AI
By Tuan Hoang, Founder of Flowmaps
Published · Updated · 5 min read
To vibe code, you describe what you want in plain language and an AI tool writes the code. Pick one tool, plan your features first, then build one small step at a time and test each step before the next. Flowmaps (flowmaps.app) turns your idea into that plan, with one prompt per step.
You don't need to know how to code to start. You do need to know what you want. Most vibe coded apps that fail don't fail because of the AI. They fail because nobody decided what the app should do, or in which order to build it.
What is vibe coding?
Vibe coding means building software by talking to an AI instead of writing the code yourself. You describe a feature, the AI builds it, you look at the result and say what to change. The term was coined by AI researcher Andrej Karpathy in early 2025 and is now used for almost any kind of AI-assisted building.
It works well for prototypes, internal tools and first versions of a product. It gets harder as an app grows, because the AI only sees what you tell it. That's why a plan matters more here than in normal coding, not less.
Pick one vibe coding tool
Start with one tool and stay with it for your first app. These are the most used ones:
| Tool | Best for | Good to know |
|---|---|---|
| Lovable | Complete beginners who want a web app | Works in your browser, uses credits per message |
| Bolt | Quick prototypes in the browser | Fast to start, shows the code as it writes |
| v0 | Good-looking screens and pages | Strong at design, made by Vercel |
| Replit | Apps that need a server right away | Builds and hosts in one place |
| Cursor | People who want to see and edit the code | A code editor with AI built in |
| Claude Code | Bigger projects on your own computer | Works in your project folder, step by step |
Not sure? Pick a browser tool like Lovable or Bolt if you've never seen code. Pick Cursor or Claude Code if you want to keep full control of your project. The best vibe coding tools compares all seven in more detail, including Codex.
How to vibe code in seven steps
1. Write your idea in three sentences
Who is it for, what problem does it solve, and what is the one thing a user does in it? For example: "A booking app for dog walkers. Owners book a walk and pay online. Walkers see their walks for the day."
2. List the features before you prompt
Write down everything the app needs, including the boring parts: sign-up, password reset, emails, a settings page, payments, a privacy page. These are the parts beginners forget, and adding them late is what breaks working apps. See how to write an MVP feature list.
3. Cut the list to a first version
Mark what you need to launch and move the rest to "later". A first version with five features that work beats twenty that half work.
4. Put the features in build order
Some features need others. Payments need accounts. A dashboard needs data. Build what other features depend on first: the project setup, then the database and logins, then your main feature, then payments and emails.
5. Give the AI one small prompt at a time
One feature per prompt. Say what to build, what data it needs, who can see it, and what the AI must not change. "Build me a booking app" makes the AI guess everything. "Add a page where a signed-in owner can book a walk by picking a date and a walker" does not. More examples are in how to write prompts for AI app builders.
6. Test every step before the next one
Click through what was just built. Does it save? Is it still there after a refresh? A bug you find right away takes one message to fix. A bug you find ten prompts later can take a whole evening.
7. Save your work as you go
Save a version every time something works. Browser tools keep a history you can go back to. With Cursor or Claude Code, use git, or ask the AI to save your work for you. When a prompt goes wrong, going back one step is faster than asking the AI to repair it.
Common vibe coding mistakes
| Mistake | What happens | Do this instead |
|---|---|---|
| One giant prompt | The AI guesses, and you fix the guesses | One feature per prompt |
| No plan | You discover missing features halfway | List your features first |
| Wrong order | Late logins break pages that worked | Build logins and data first |
| No testing | Bugs pile up and hide each other | Test after every step |
| "Fix it" prompts | The AI changes things at random | Say what you saw and what you expected |
Plan it once, then build
Steps 2 to 5 are the planning, and they're what Flowmaps does for you. You describe your idea, and it becomes a map of every feature in build order. It suggests the features you'd forget, flags risky ones like payments and personal data, and writes one build prompt per feature for Lovable, Bolt, v0, Replit, Cursor or Claude Code. Your plan stays in one place while you build, so you always know what's done and what's next.
It's free to start. Read how to plan an app before you build it with AI for the full method.
Frequently asked questions
Do I need to know how to code to vibe code?
No. You describe what you want in plain language and the AI writes the code. It helps to learn a few basics along the way, like what a database and a login are, so you can explain what you want more clearly.
What is the best tool to start vibe coding?
For a complete beginner, a browser tool like Lovable or Bolt is the easiest start, because there is nothing to install. If you want to see and keep your code on your own computer, start with Cursor or Claude Code.
Why does my vibe coded app keep breaking?
Usually because features were built in the wrong order or in prompts that were too big. When a new feature needs something that isn't there yet, like logins, the AI rebuilds parts that already worked. A feature list in build order and one small prompt per step prevent most of this.
Can I build a real product with vibe coding?
Yes, many people launch real products this way. Take extra care with logins, payments and personal data, and have someone qualified check those parts before you take paying customers.