Modern Creator
Zinho Automates · YouTube

The 3 Levels of Vibe Coding AI Apps with Claude Code

A framework for why most Claude Code prototypes never leave your laptop, and the three thresholds that turn one into software other people can actually use.

Posted
1 months ago
Duration
Format
Tutorial
educational
Views
36.6K
Big Idea

The argument in one line.

Vibe coding levels are about how far the app reaches, not how good the prompter is: level one only runs on your laptop, level two adds real logins and permissions, and level three lets Claude Code operate the live database directly.

Who This Is For

Read if. Skip if.

READ IF YOU ARE…
  • You've built something with Claude Code that works great on your laptop, then hit a wall the moment a client, teammate, or sponsor needed their own login.
  • You're running a small content or client-facing operation (videos, sponsors, a team) and want an actual system instead of a spreadsheet or a pile of local scripts.
  • You want a mental model for what separates a 'vibe coded' demo from software you could actually hand to someone else.
SKIP IF…
  • You already run production apps with real authentication, role-based permissions, and a hosted database. This is an intro-level framework, not new information for you.
  • You want a hands-on build tutorial. This video is a framework pitch built around one specific app builder (Softr), light on step-by-step detail.
TL;DR

The full version, fast.

Most people who 'vibe code' with tools like Claude Code get stuck at level one: working code that only runs on their own laptop, with no login and no way for anyone else to access it. Level two turns that prototype into a real multi-user app by connecting it to a database and authentication layer, so different people see different things based on their role. Level three goes further: Claude Code gets MCP access to that app's own database, so instead of manually adding fields or updating records by hand, you describe the change in plain language and the agent does the database work directly. The takeaway: the hard part of shipping AI-built software was never the code, it's the user management and operations layer wrapped around it.

Free for members

Chat with this breakdown — free.

Sign in and you get 23 free chat messages on us — ask for the hook, quote a framework, find the exact transcript moment, generate a markdown action plan. Bring your own key when you want unlimited.

Create a free account →
Chapters

Where the time goes.

00:00 – 01:33

01 · Intro

Cold open contrasting a level-one demo (works only for you) against a level-three payoff (one link, different views for different people), then states the video's own build: a content pipeline board with videos, tasks, team, and sponsors.

01:33 – 03:40

02 · Level 1: You get code

Claude Code turns one prompt into a working local app in under a minute, but it only runs on localhost: no login, no way to share it, and connecting it to a database and host to fix that means juggling three separate services that can break independently.

03:40 – 06:40

03 · Level 2: You get a real app

Switching to Softr, the same one-sentence description generates a full multi-user app: database, pages, login/signup/permission-denied utility screens, and role-based data restrictions, so a sponsor logging in sees only their own video's status and nothing else.

06:40 – 09:32

04 · Level 3: The app that operates itself

New ideas after launch, like a missing field, 40 records needing a bulk update, or an ad-hoc data question, get handled by connecting Claude Code to the app's own database via an MCP server, so the agent reads, writes, and edits schema directly instead of anyone clicking through rows by hand.

09:32 – 11:00

05 · The rules

Three guardrails from nine months of vibe coding: describe the outcome not the implementation, never ship what you can't personally verify, and build the smallest version a real person can actually touch.

11:00 – 11:37

06 · Outro

Points viewers to the free community for the exact prompts and MCP setup used in the video, then closes with a standard subscribe ask.

Atomic Insights

Lines worth screenshotting.

  • Vibe coding has levels, and most builders get stuck at level one: an app that only works on their own laptop.
  • A level-one app has no login and no permissions, so anyone else who opens it sees either nothing or everything.
  • The gap between a prototype and a real app isn't the code, it's user management: different people need to see and do different things.
  • A prototype has one user. A real app has multiple users who see different things, can do different things, and can log in from anywhere.
  • Connecting a Claude Code prototype to a separate database and hosting service means keeping three connections in sync, and if one breaks, the whole thing falls apart.
  • Describing an app once tends to produce more than the requested pages: utility screens like login, signup, forgot-password, and permission-denied get generated alongside the ones asked for.
  • The real test of a level-two app is that a sponsor logging in sees only their own video's status, not other sponsors, payment terms, or unannounced videos.
  • Automation that fires without anyone opening a laptop, like a video flipping to 'published' and notifying the right person automatically, is what separates a real app from a dashboard someone has to check.
  • New fields and one-off data questions, like which videos have sat in editing over two weeks, don't require rebuilding the app. An agent with direct database access can answer them by querying records directly.
  • Adding a new field to 40 existing records normally means opening each one by hand. Giving an AI coding agent read, write, and schema-change permissions on the database turns that into one plain-language instruction.
  • Rule one for vibe coding: describe the outcome, not the implementation. Specifying the framework or file layout means you've stopped vibe coding and started managing.
  • Rule two: never ship what you can't personally verify. You don't need to read every line of AI-generated code, but you need at least one thing you can check with your own eyes.
  • Rule three: build the smallest version a real person can actually touch, not the full feature list.
Takeaway

Software has levels, and the gap between them isn't skill.

WHAT TO LEARN

The line between a demo and real software isn't better prompting, it's whether the app has logins, permissions, and a way for someone else to operate it without you.

02Level 1: You get code
  • A prototype that 'works' but only runs on your own laptop, with no login and no way for anyone else to reach it, isn't a level problem you can prompt your way out of.
  • Wiring a local prototype to a separate database and hosting service to make it multi-user means keeping three connections in sync, and any one of them breaking takes down the whole app.
03Level 2: You get a real app
  • The real difference between a prototype and an app is whether multiple users can see different things, do different things, and log in from anywhere without anyone touching code.
  • Describing an app to an AI builder tends to generate more than what you asked for: utility pages like login, signup, password reset, and permission-denied screens usually appear unprompted, and they're the parts that make an app usable by strangers.
  • The test that actually matters for a multi-user app: can one type of user, a sponsor, a client, a teammate, log in and see only what belongs to them, with everything else invisible rather than just hidden by the interface?
  • Automation that fires without you opening your laptop, like notifying someone the moment a record changes status, is what turns an app from something you check into something that runs itself.
04Level 3: The app that operates itself
  • Once an app is live, new questions and one-off data fixes don't require rebuilding anything. An agent with direct, permissioned access to the app's own database can answer or execute them on request.
  • Giving an AI coding agent explicit read, write, and schema-change permissions on a live database turns a task like adding a new field and backfilling 40 existing records from a manual afternoon into one plain-language instruction.
  • The highest level of vibe coding isn't a bigger app, it's an app that keeps up with ideas you have after day one without needing to be re-described from scratch.
05The rules
  • Describe the outcome you want, not the implementation. The moment you start specifying frameworks or file structure, you've stopped vibe coding and started managing, which defeats the point.
  • Never ship anything you can't personally verify. You don't need to read every line an AI agent writes, but you need at least one concrete thing you can check yourself, like whether a login actually blocks who it's supposed to block.
  • Build the smallest version a real person can actually touch rather than the full feature list. A working narrow slice beats an unshipped complete one.
Glossary

Terms worth knowing.

Vibe coding
Building software by describing what you want in plain language to an AI coding tool, rather than writing the code by hand.
MCP server
A connector that lets an AI coding tool like Claude Code read, write, and modify a separate app's database directly, instead of a person clicking through that app's interface.
Role-based permissions
Rules that determine what different logged-in users can see and do inside the same app, so a sponsor and an owner get different views of identical data.
Schema
The structure of a database: which tables exist, what fields each one has, and how they relate to each other.
Resources

Things they pointed at.

Quotables

Lines you could clip.

00:00
“vibe coding has levels and most people are simply just stuck at level one”
clean thesis statement, works as a cold open hook→ TikTok hook↗ Tweet quote
03:16
“the code is not the hard part anymore. Everything around that code is where the difficulty lies”
reframes the entire premise of the video in one line→ newsletter pull-quote↗ Tweet quote
05:56
“nobody installed anything, nobody got a repo, you just sent a link”
punchy proof-point for the level-three payoff→ IG reel cold open↗ Tweet quote
10:49
“if nothing in the build is checkable by you, then you are not shipping software, you are simply just hoping that it's all going to work out”
sharp, quotable rule with real stakes→ TikTok hook↗ Tweet quote
The Script

Word for word.

Read-along

Don't just watch it. Burn it in.

See every word as it's spoken — crank it to 2× and still catch all of it. The same dual-channel trick behind Amazon's Kindle + Audible.

metaphoranalogy
everyone is vibe coding right now you just type in a sentence and you have an app but here's the thing that nobody tells you vibe coding has levels and most people are simply just stuck at level one now level one is where it only works basically for you someone else tries to log in and then there's no login the data is on your laptop and nobody can actually access it and even when they can they see everything in the app because permissions were never built in now that is not a prompt problem that's a level problem here is level three okay my actual app my editor opens it and sees exactly what she needs nothing more a sponsor logs in and sees the video and nothing else nobody installed anything nobody got a repo just a link that's the difference between a real app and just a sample and i'm gonna be showing you exactly how to build this kind of business app for your own business now level two and three they both run on software because that's the tool that actually gives your app some real data and on top of that also authentication and even more so sign up with the link in the description down below plus every single prompt that we are going to be using in today's video is inside our free school community that link is also down in the description below now let's hop over to the laptop
So let's start off with the tool that most of you are already using, okay? Cloud Code is the fastest path from a sentence to working code, okay? You simply just describe what you want and then it plans before it acts, which is so important.
And then it edits across files and it runs the commands itself, okay? Now, one thing before we go even further. and i have to point this out because it's so important these levels are not beginner to expert okay these levels are about how far the app gets not how good you are okay so Let's focus first on level one.
You get the code, okay? So what we are building. So here's the thing that I'm building at every level, okay?
A content pipeline board, videos with a status, tasks under each video, who is doing what, and the sponsors attached to the video they paid for, okay? So pretty simple. now i'll just prompt cloud code and then it plans it and then it's going to build the file structure and then it's going to write out the logic and then in just a few seconds to possibly a minute we get our result okay there is my board now there's videos statuses there's tasks now it works exactly the way i asked but it's a local host which basically means that i can't send it to another person this app only lives on my device so if i want to make a deal i actually need to connect it to two other tools which is going to be a database and somewhere to host this app okay so something like superbase or vercel Of course, now the thing is that you can do that, but that also means keeping three connections up to date.
And if one breaks, then that unfortunately means that the entire thing is just going to fall apart. So the code is not the hard part anymore. Everything around that code is where the difficulty lies.
And here is where level two of vibe coding actually comes in.
Now, a prototype has one user. A real app has multiple users who all see different things, and they can also do different things, and they can log in from anywhere without touching a line of code. Now, that difference is the entire job.
Softer is an app builder that's made for business software. So, same idea, you describe what you want, except it generates the database, the pages, and also the user roles together as one connected system. So, I'm...
to be giving it the same description that i gave claude code i'm gonna make sure it's word for word so the content pipeline board videos with statuses tasks team sponsors attached to their videos okay so one prompt and here's what it came back with okay four tabs across the top and those four tabs are the whole argument interface is the app itself data is the database users is who can get in and workflows is what happens automatically.
Okay, so it's pretty simple. Start with the data, videos, tasks, team, sponsors, all ready related. Okay, open a task and it points at an actual video record and not a title that someone simply just retyped and misspelled.
Now, the part that I want you to actually look at, okay, open up pages and there is the app, okay? Board, video detail, tasks, team, everything is fine and it's... basically as I expected.
But if you scroll down, there's utility pages, okay? So as you can see, there's a login, sign up, forgot password, reset password, account settings, permission denied, link expired, page not found. Now, I never asked for a single one of these, okay?
So under users is the other half of it, okay? So user groups, data restrictions, which can tell what each group can actually see. So now when a sponsor gets an account, they log in and they see the status of their video.
So they do not see my other sponsors, which is so key to this. They do not see what I am paid. They don't even see what videos I have announced yet.
It's the same app, it's the same database, but it's a completely different thing on their screen. Now, nobody installed anything, nobody got a repo, you? sent a link so if you want to tie this level yourself the link to software is down in the description below like i mentioned and there's also workflows in software and it's pretty important because automation is not something that you simply just wait for it's built right side so in our app if a video flips to published then the app actually tells the right person on its own without me having to do anything whether or not my laptop is even open so That is a working app, okay?
Real users, real permissions, real automation. Now, that raises the obvious question. If level two already does all of that, then what could possibly be left?
Well, that takes us perfectly into level three, okay? So, here's what level two gives you. Let's just refresh that quickly.
The app that you described on the day and the way that you described, okay? You do not stop having ideas on day one. Three weeks in, there's a field that you didn't actually think of and 40 records that still need updating all at once and a question about your own data that no page in the app was actually built to answer.
And reprompting the whole app is not necessarily the answer to any of that. so level three comes in and it's not about building the backend again it's about operating the one that you already have and you do so without clicking through it though by row and softer has an mcp server that lets you connect to cloud code so you can have cloud code working your back end directly instead of having to manually change hundreds of records or adding new databases each time setting it up literally takes less than a minute all you have to do is just copy the link to software's mcp it's right there in the description and and add a custom connector in Cloud Code.
And then you just paste in the link and authorize software. And it asks which permissions I want to basically hand over. And these three are super important to enable, okay?
So what you have to do is read records, write records and change schema. That basically means create and modify databases, tables and fields. So now Cloud Code can see my software workspace and it has around 20 tools.
So watch what actually changes. First one, I want to know which videos are stuck. Now, it's not a page that I built, but it's simply just a question that I just thought of.
So I ask which videos have been sitting in editing longer than two weeks and who is on each one. Okay, then it searches the tables and it tells me no page, no filter, no clicking. So the second one, and this is the one that really is so, so, so important.
i basically decided that every video needs a priority okay so that field does not exist at this point and there are about 40 videos already there now normally that is basically add a field and then open the 40 records and then set it all by hand which can be so time consuming now instead you add a priority field to videos then set it based on how close the publishing date is and whether a sponsor is attached and then it adds the field and it reads what is already and then it fills in all 40 for you.
And I mean, I never even opened up the data tab. Clawed code operates the data, softer is the app around it. Now level one gets you the code, level two gets you the app, and level three comes along and then it gets you an app that literally just keeps up with you.
Now that is a game changer.
Now, there's three rules that I've learned from vibe coding over the past nine months that you also need to know, because even if you follow my system, some mistakes are lethal pitfalls, okay? So rule number one is always describe the outcome, not the implementation. The second you start telling it which framework to use or how to lay out the files, you have stopped vibe coding and you started managing.
So say what the thing needs to do and who it is four then you need to get out of the way and let it make the calls that it is better at making you are now rule number two and this is the one that people actually skip unfortunately never ship what you cannot check okay so these tools produce confident plausible working looking output that is sometimes just wrong okay so you do not have to read every single line because that can take up a lot of time but you do need one thing that you can verify with your own eyes does the number add up?
Does the login actually stop the person that it's supposed to stop? If nothing in the build is checkable by you, then you are not shipping software. You are simply just hoping that it's all going to work out.
And rule number three, build the smallest version that a real person can actually touch, not the full feature list. Now, everything from this build, the prompt that I used at both levels, and the MCP setup, all of it is inside our free school community. The link is down in the description.
below and Softer's free plan is also linked down there. So you can run the whole thing without paying for anything. Go and build it yourself because that is where it actually lands.
Now, what I want you to do is take all the information that you learned from this video and go and start building today. Now, if this helped you, then please give this video a like, subscribe to the channel, turn on those bell notifications so that you never miss another upload. Check out some of the other videos on the channel.
I know you are going to love it. And also, as always, I'll catch you on the next one.
The Hook

The bait, then the rug-pull.

Most vibe coding demos stop at the same wall: an app that works perfectly, but only for the person who built it. This breakdown lays out the three levels that separate a local prototype from software other people can actually log into, and the MCP setup that lets an AI coding agent operate a live app's database directly.

Frameworks

Named ideas worth stealing.

00:00model

The 3 Levels of Vibe Coding

  1. Level 1: You get code
  2. Level 2: You get a real app
  3. Level 3: You get an app that operates itself

A maturity model for AI-built software, staged by how far the app reaches (local code, multi-user app, agent-operated app) rather than by builder skill.

Steal forframing any 'AI can build your app' pitch, or an internal roadmap for productionizing a Claude Code prototype
09:34list

Three Rules of Vibe Coding

  1. Describe the outcome, not the implementation
  2. Never ship what you can't check
  3. Build the smallest version a real person can touch

Three guardrails for working with AI coding agents without losing control of quality.

Steal fora checklist to run before shipping any AI-generated feature
CTA Breakdown

How they asked for the click.

VERBAL ASK
01:49product
“sign up with the link in the description down below plus every single prompt that we are going to be using in today's video is inside our free school community”

CTA lands under two minutes in rather than only at the end, pitching both the sponsor tool (Softr) and the free community as the place to get the exact prompts used in the video.

Storyboard

Visual structure at a glance.

open
hookopen00:00
level 3 preview: one link, different eyes
promiselevel 3 preview: one link, different eyes01:03
level 1: you get code
valuelevel 1: you get code02:11
level 3: agent queries the live database
valuelevel 3: agent queries the live database08:36
CTA: free community
ctaCTA: free community11:09
Frame Gallery

Visual moments.

One-click upgrade to your Google

Get more breakdowns in your search results

Add Modern Creator as a preferred source and Google shows you more of our breakdowns in Search, Top Stories, and AI Overviews. It only changes what you see, and you can undo it in your Google settings anytime.

Add to Preferred SourcesOpens your Google source preferences with us pre-loaded. Tick the box and you're done.
Watch next

More from this channel + related breakdowns.

12:43
Zinho Automates · Tutorial

Claude Design 2.0 Just Became Unstoppable

A hands-on tour of Claude Design 2.0 — shared usage pool, live canvas editing, brand-locked design systems, and a two-way Claude Code handoff — proven by building a landing page, pitch deck, and database-wired dashboard for a fictional fragrance brand in one sitting.

July 1st