The 5 Levels of AI App Building (Vibe Coding Master Class)

Master these five things and you can vibe code anything. None of them are hard.

Don't be discouraged. Just push through. So I saw this tweet yesterday and I completely agree. You can make insanely powerful apps if you just understand a few AI tools

agree. You can make insanely powerful apps if you just understand a few AI tools and then these five AI coding topics, authentication, database, storage, cron jobs, and APIs. And so these might seem technical, but they aren't that technical.

And if you're just a vibe coder like me, I've never written a single line of code, you can understand these concepts and everyone would benefit by understanding them. And

so in this video, we're gonna build an app while using all five of these concepts. I'm gonna be implementing them into the app that I build. And so that

concepts. I'm gonna be implementing them into the app that I build. And so that by the end of this video, you're gonna be able to create a high quality application using any vibe coding tool that you want. Hey guys, quick note. I just

created a brand new YouTube channel that is a collaborator on this video called Vibe Coding Explained. This is a new channel that I'm making and I'm going to make

Coding Explained. This is a new channel that I'm making and I'm going to make a lot more off the cuff videos. They're not going to be highly edited. There's

going to be a lot more content all about vibe coding and diving deep into some more advanced topics. If you want to dive deeper into vibe coding, make sure to follow that account. Anyway, let's dive back to the video. All right, so let's go ahead and break down auth, database, storage, cron jobs, and APIs. And before

we dive into the problem that I wanna solve and the app that I wanna build, let's first do a quick rundown of what each one of these things are.

So auth or sign in, this is basically just verifying who someone is before letting them access your app, right? If we go to twitter.com, right, I have to sign in so it knows that I'm on Riley Brown's profile, right? It would be weird if I signed in and I could see Greg Eisenberg's messages, right? I need to authenticate and that's what auth is. You need this whenever you have like accounts, login

pages or personal data, et cetera. For databases, right? Databases are just an organized place to save and retrieve information. When I tweet, hello there, right? This information along with the time that I'm posting at is stored in the database, right? An organized place to save and retrieve information that persists even when your app restarts. And what is

stored? Storage is like database except it's for file. Storage is where you keep files

stored? Storage is like database except it's for file. Storage is where you keep files like images, videos, PDFs, and other uploads from users. Any apps with profile pictures, file sharing, photo galleries, document uploads, anything that is stored in storage. And so you can think of this like a Google Drive. Users that sign in can upload files into

their own little drive within your application. That is storage. Cron jobs are the one that I have spent the least time doing. If you understand Zapier or Make, if you were to ever or schedule a trigger automatic tasks that run on a schedule without you clicking anything. This could be anything from like sending daily emails, clearing old

data, generating reports, backing up databases, or checking for updates. Another thing, and the thing that we're actually gonna talk about the most right now, I think this concept right here is the best to understand. APIs are like little powers that you can add to your app in the age of AI, right? You can add OpenAI to your app so that you can create a chat GPT wrapper. You're basically using OpenAI's technology

to create a feature within your app that makes it a lot more immersive and fun to use. So it's a way for different apps or services to talk to each other and share data. And we're gonna talk a little bit later about where to find the best APIs. When you need this is when you're connecting to payment processors, weather data, map, social media, sending emails and AI services. And the AI

services part are the things that I'm most excited about. So what we're gonna talk about in this video, these five things of separate what a site is, right? You

know, a site, a boring landing page, right? It's just a site, right? It has

files, it's hosted somewhere on the internet, but an app has files, but you can sign into it. You can store data there, right? You can upload different files and it has different powers or APIs. We're seeing AI really start to accelerate up how good they are at creating these four features. And this is what will allow for Vibe coders to create any app that they want. Anyway, let's go ahead and

talk about the app that I want to build. And we're gonna build it in two sections, the MVP section, and then we're gonna build out the full app with all of these included. So I wanna hone in on the problem. That's what I always do. And I wanna create an app for my team, right? I vibe code

always do. And I wanna create an app for my team, right? I vibe code a lot internally. I am at a startup with nine people and we create little mini programs that make it easier for us to do certain tasks. And I'm in marketing, obviously. And so I make a lot of internal tools for marketing. And one

marketing, obviously. And so I make a lot of internal tools for marketing. And one

thing I've been thinking about a lot is it's really hard to find really good examples for short form content. And yeah, you can scroll Instagram to find examples, but then you end up in the algorithm. You get ended up being distracted and it's just not a good use of your time. And so one solution is like, what if you could create a feed of your favorite creators? So instead of showing the

videos, it shows you the transcripts with a link to watch if you want. But

what you're focused on is the transcript and then you can actually use AI to analyze that transcript and potentially add features like create one, but about my company. And

it comes up with, it generates a bunch of different ideas that you could use based on people's transcripts. And so that's what I wanna do. And so what I wanna solve for first, right, is I want to be able to paste a link to a Instagram video And I want it to pull the title. I want it to pull the creator. So I want it to show like a thumbnail image of

the video and then have the transcript out. Maybe you can scroll the app like it's Instagram and maybe we can make this into a mobile app. But what I want to solve for first are the basic APIs. And so like I said earlier, APIs give powers to your apps. But let's actually, what I want to show you is I want to show you how easy it is to find APIs on the

internet. I want you to find an API. And if you're like, What does API

internet. I want you to find an API. And if you're like, What does API stand for? Doesn't matter. What APIs are, they have a key that you can use.

stand for? Doesn't matter. What APIs are, they have a key that you can use.

And by the way, you do have to pay for every time it's used. But

a lot of the time it's like one penny or less than a penny for certain things. And you can use these little powers and plug them into your app.

certain things. And you can use these little powers and plug them into your app.

And so I'm basically saying I want to find an API and actually I won't use perplexity. I'm just gonna use chat GPT to keep it as simple as possible.

use perplexity. I'm just gonna use chat GPT to keep it as simple as possible.

I want you to find an API that allows me to paste an Instagram link and it returns a transcript for that Instagram reel.

Search the internet and find an API that would satisfy me. my request. And so now we're asking GPT-5 to search the internet and find

me. my request. And so now we're asking GPT-5 to search the internet and find the API. And that's one thing that's really fun about these AIs that can search

the API. And that's one thing that's really fun about these AIs that can search the internet is like this used to be like a niche thing. You'd have to go on Stack Overflow, find different technology, but there's people out there who've created this technology, hopefully. I've actually never done this before, but I'm just assuming that there is

technology, hopefully. I've actually never done this before, but I'm just assuming that there is an API out there that solves this. So here we have get transcribe API, super data, Instagram, So I've used SupaData for pulling YouTube transcripts, but I've never actually done it for Instagram. And so

that's really cool. And so now that I have a list of technologies that I could use for my app, right? You think about where we are, right? I kind

of want to keep track of what we've done in this video. So I'm going to just put search chat GPT for APIs, right? This is what we've done and it returns us a list. And so what I'm looking for, a list of possibilities.

And so what I want to look for is is I wanna look for one that's like cheap slash affordable. And then ideally, ideally there's some sort of playground. So there, anytime you use an API, there's usually an API provider, right? So

playground. So there, anytime you use an API, there's usually an API provider, right? So

when you search for an API, there's gonna be an API provider. And so if you think of OpenAI as an API provider, right? You can go to OpenAI Playground.

And if you have a ChatGPT account, you have access to this, right? You can

go to the playground. And if you click on dashboard here on the side, you can see you kind of have access to some of their tools in the background.

Like here you have this images playground and here you can test the different models and I can just type anything. I can just type dog. And so I'm actually using my API keys here. And so every time I run this, it does cost a little bit of money, but you can see here, I'm testing the API in this little playground and we can see how long it's taking. And so I'm using

their interface to create this to test, to see how effective this OpenAI image API is and we can test it right here. And then once we like it in the playground, we're like, okay, I want to create an app with this experience in there. Then I'm going to add it, right? Very similarly, you have something like

in there. Then I'm going to add it, right? Very similarly, you have something like FAL. So FAL, it is a provider for a bunch of the creative AI tools

FAL. So FAL, it is a provider for a bunch of the creative AI tools like FAL, VO3, image to video, FAL, Nano, Banana. This is an image editing playground, right? I can go in, I can test them and you can test all

playground, right? I can go in, I can test them and you can test all of them for the same thing for Grok with a queue. They host the fast largest large language models on their TPUs. I forget what LPU. I don't even know what it means, but they are a provider of really fast AI models. Exa, for

example, is another one that provides search related things. And so these companies are massive.

This is a billion dollar company. This is a billion dollar company. And Exa is going to be a billion dollar company soon. I'm pretty sure they just raised it a $500 million valuation because they're providing all of these different apps with search, with really fast models, with creative models, and then open AI. soon to be a trillion dollar company. And they do make a lot of money off of providing different tools.

dollar company. And they do make a lot of money off of providing different tools.

And so one of the tools that they mentioned here was this SupaData. And so

if we just go to SupaData, let's just search SupaData. And I've used this for YouTube transcripts before. I think I should, oh my God. There's my API key.

Okay. So one thing about using APIs is you want to keep your API keys private. I just exposed it. That's okay. I'm going to change it after this video.

private. I just exposed it. That's okay. I'm going to change it after this video.

And so I'm going to copy this link and here's a sample URL. This is,

I'm gonna just, just copy the API key. I'm just going to go super data.

I don't want to do this. Okay. It's going to make me, I'll do this later. Okay, I'm gonna go to documentation. I'm gonna go

later. Okay, I'm gonna go to documentation. I'm gonna go transcript. And so I'm basically looking for if they have Instagram.

transcript. And so I'm basically looking for if they have Instagram.

Okay, Instagram URL. Okay, very cool. Oh, playground. There we go. SupaData has a playground. And so I can paste a URL if we just go to Instagram. Let's

playground. And so I can paste a URL if we just go to Instagram. Let's

see if we can pull an Instagram transcript. We'll pull my latest video right here.

Yeah, this one went crazy. I'm pretty sure this video got $600. 20k likes i want to get the transcript because i want to use this as an example later and so i'm just going to copy this link and we're going to go back to the playground because remember we're testing it we're going to see what it returns we're going to get an api key i think i copied my api key so

we just paste it right here and now we can run so now we're testing to see If this works, we're gonna test to see how it works and hopefully it returns a YouTube transcript. And so I'm gonna just do markdown. Okay, look, this is the response in markdown that it gave. OpenAI just released this agent builder that could kill NAN and Zapier. If we listen to this video right here. Just released

this agent builder which could kill NAN and Zapier. So I have no idea how this technology works, right? This super data technology. I have no idea how they're pulling the transcript, but I don't care because I can use it. and we can check the pricing. We can see that if we spend $300 per month, I'm assuming,

the pricing. We can see that if we spend $300 per month, I'm assuming, then it's really fast and it's 20, auto recharge is $20 per 20,000 requests. Okay, so you get credits. E1 transcript equals run credit. That does

20,000 requests. Okay, so you get credits. E1 transcript equals run credit. That does

not seem bad. That seems decent, especially if it's an internal tool, that's probably great.

So that's cool. So we have the API key and what I wanna do is I actually wanna go to documentation and we're gonna click on transcript because remember this is where I found that it has Instagram. We want it to see where it mentions Instagram. In this documentation, this is like the instruction manual for the API.

mentions Instagram. In this documentation, this is like the instruction manual for the API.

It's useful to have this link. So if we go back here, we're gonna be using, so the function that this API is going to have is it's going to be pull Instagram transcript from link. We're using SupaData.

The docs can be found at this link right here. And we have an API key, which is right here. You definitely wanna keep this private. I'm gonna cancel it immediately following this video, so we'll be fine. And yeah, so here we are. So

we have all of this important information that we can copy. Now let's go create this MVP, right? The MVP, which is scrapes a link, Actually, we're not even gonna do this. We're gonna create this right here. You paste the link and I want

do this. We're gonna create this right here. You paste the link and I want it to return the transcript. That's what I want it to do. Okay, so what do you say we start actually vibe coding? And if you've watched my content before, you've seen me use cursor. We are gonna be using cursor. And so what I'm gonna do is I'm gonna open up a new window in cursor and we're gonna

open this up full screen. We're gonna open up a new project. We're gonna create a new folder. And this is just gonna be Instagram scraper. We're going to go ahead and open this up. For those of you who love using Claude code, that's exactly what we're going to be doing. We are going to be using the Claude code extension. So I'm going to go to Claude code VS code, and we're just

code extension. So I'm going to go to Claude code VS code, and we're just going to click on this right here. Or you could probably do the same exact thing in the cursor chat. I'm just going to be using Claude code within cursor.

And so what I want to do here is I want to create a basic MVP. So this is what I'm gonna do. I'm gonna use Whisperflow. I want you

MVP. So this is what I'm gonna do. I'm gonna use Whisperflow. I want you to create a basic MVP. I want you to create an app that allows me to paste in a link to an Instagram video and I want it to scrape the transcript and display it in a very clean interface. I also want to be able to paste in multiple links separated by commas and for it to pull the

transcript of multiple videos. So input from user is the link or links. Then I

want you to show the video, video transcript. And you know what? I'm actually gonna go over to comment and yeah.

And I pasted a, just a light sketch of what it could look like. I

don't know if you get the title in the API or if you get the like the creator name in the API, but we can figure out a way to do that later. And for the image, put a placeholder image for now. If the

super data doesn't pull like a thumbnail image from Instagram, we can figure out another way to do that. But make it look like this structure. Make this a very simple app white background and make it monochrome black and white. for

now. Okay. And then I'm going to paste all of the information. Here is the info on Supa data. Then I'm going to say, create the app and run it locally. Oh yeah. This is a going to be a next

locally. Oh yeah. This is a going to be a next JS project. All right. So that was a long

JS project. All right. So that was a long prompt. We're creating this basic app right here. Paste link. return

prompt. We're creating this basic app right here. Paste link. return

Instagram transcript and we're gonna have a placeholder for this image, ideally. We'll see if this works. Yes, don't ask again. Okay, so it's going.

this works. Yes, don't ask again. Okay, so it's going.

It has a lot of to-dos to do, right? It's basically initialize Next.js project, review the super data. So it read that documentation link that I gave it, which is the instruction manuals to the API. And then I gave it the key and that's how it's gonna use it. And now we're continuing to wait. It's

been going for like three minutes. Okay, so I believe it's done. It's running on localhost 3002. I'm gonna click on this. Okay, we're getting this little error. I'm just

localhost 3002. I'm gonna click on this. Okay, we're getting this little error. I'm just

gonna copy this error. I'm gonna paste it back in. Not sure what that is all about. Okay, one thing with APIs is you actually need to set up a

all about. Okay, one thing with APIs is you actually need to set up a .env file. So I'm just gonna type in .env. I'm gonna make a new file,

.env file. So I'm just gonna type in .env. I'm gonna make a new file, .env. I'm gonna click on it. And I'm just gonna call this SupaData. underscore API

.env. I'm gonna click on it. And I'm just gonna call this SupaData. underscore API

underscore key equals. And I'm going to paste that key in here. Here's the key that we need to add. I'm going to hit save. And then I'm going to say I've added the super data API key here. Please fix.

Use this key. Oops. To dot ENV. Okay. So if we go to comment, there we go. So here's our site. It's running on localhost 3002. Now here,

Instagram transcript scraper. I'm going to paste my Instagram link that I had right, where was that? Instagram link, get transcript. Let's see if this works. This seems to be taking a lot of time. Oh, there we go. OpenAI just releases agent builder, which could kill NAN and Zapier. So yes, OpenAI just released. Okay, this is pretty

cool. What happens if we were to paste two links? Let's go to Instagram.

cool. What happens if we were to paste two links? Let's go to Instagram.

This works, this is cool. Okay, let's go to my account. Let's go ahead and go to Reels. So we have this one, which is 620K views. This one has 415K views. Let's go ahead and copy this. Let's go ahead and paste this here.

415K views. Let's go ahead and copy this. Let's go ahead and paste this here.

GetTranscript. Let's see if this works with multiple. Does take a little bit of time, but I don't think that's bad. Let's see if it does too. Okay. So when

I did two of them, wait, Let me see if I got the right one.

Okay. It failed with this one right here. Let's see if this one fails when it's just one. So it failed on two, like getting two transcripts, but we're testing it with one. Okay. So it's failing with two. I'm gonna test it in the other order. Let's see. Okay, so it is failing. I tested two Instagram links and

other order. Let's see. Okay, so it is failing. I tested two Instagram links and I tested them with only one link at a time and those both worked. However,

when I tested it with multiple links separated by a comma, it did not work and one of them worked, but then the next one got this error. We'll paste

this error and I'm just gonna add, please fix this. So this is cool.

So we can pull this. We need to figure out a way to like pull this information and we can do that. We're gonna figure that out. But we do have the transcript, which is like the main thing that I wanted for this. And

so that's pretty cool. There we go. We got it. That is very, very cool.

So we have this transcript. It can pull multiple links at once. That is sick.

It's a very simple app, right? This is a very simple app, but we don't have all of the necessary ingredients to make it like a full app that I could potentially sell. Because remember, if we go to Excalibur, this is a bunch of code files. So this we do have, right? We have files. And we do have

code files. So this we do have, right? We have files. And we do have one API, but we don't have all of the APIs, right? We have like API one for our MVP. Like we could just type in like a name of a person and just like scrape their profile. So that's the next thing that I wanna be able to do. And so what I wanna do here is let's do this

directly in Claude code. In fact, that's what we're just gonna do. We're gonna go to cursor and I'm just gonna say, I'm gonna go clear, right? I'm gonna clear the conversation. I'm gonna say, okay, we just added the ability to scrape multiple links

the conversation. I'm gonna say, okay, we just added the ability to scrape multiple links from a profile, but now I want to be able to paste in a profile link and I want it to scrape the most recent 10 videos and get those links of videos. And you're not generating any code here. You're just gonna report back to me. But one thing I also, part two of this is can we have

to me. But one thing I also, part two of this is can we have it look at the most recent 25 videos and find the ones with the top five most views or something like that, like can only get the highest performing Instagram reels from Instagram. Is that possible? Right? Because I want to be able to just

paste in an account, right? Maybe I really like Um, RPN, Roberto Nixon. And I

want to create content like him on Instagram. I want to be able to paste in his profile. I want to find his highest performing content and then give me the transcripts for all of those. Okay. So here's what Cloud Code said. Um, it's

not possible with SupaData. What I need is alternative solutions, Instagram's unofficial rest API, Appify Instagram scrapers, full featured includes all metrics. Okay. So let's try Appify. Let's go to APIify, scrapers. Okay, so we can click on this.

APIify, scrapers. Okay, so we can click on this.

Instagram scraper, try for free. We're signing up. I don't really know. I've done

APIify before very briefly. I don't know if I have an account, but I will try it for free. We're in. This $2.70 per 1,000 results.

Pretty expensive, but like for an internal tool, it's nothing. We are going to APIify. How do I use this thing? Okay, I'm just gonna copy all, or I'm

APIify. How do I use this thing? Okay, I'm just gonna copy all, or I'm just gonna copy this. I'm gonna go to cursor, I'm gonna say, okay, I will use this and we're gonna paste that link. Just in case it can't read all this, I'm just gonna paste all of this down here as context. I'm gonna say, okay, here is the keys I have. We are going to

then go, like this API endpoint. I don't

really know how this works. I've never used this site, but remember all we need to do is find an API key here. So I'm going to go to settings API key. Okay, there we go. Default API token created on signup. We're going to

API key. Okay, there we go. Default API token created on signup. We're going to copy this. I'm going to copy this API API. So I'm going to go API

copy this. I'm going to copy this API API. So I'm going to go API If I underscore API underscore key equals paste that key.

Nope, not that one. I'm gonna paste this one. And so,

okay, here the API key, I pasted in the .env file. Is

this enough info to implement? If so, just do it. All right, let's see.

So we got a link, Logohost 3003. We could click on this. Oh. Get top

videos. Oh, Instagram profile. Let's see. If we go to Instagram, we could go to profile. Let's see if it grabs my latest videos here. Get top five

profile. Let's see if it grabs my latest videos here. Get top five videos. No way this just works. No way. Nope. It ain't gonna

videos. No way this just works. No way. Nope. It ain't gonna work. It just ain't gonna work. Seems to be taking a while. One thing when

work. It just ain't gonna work. Seems to be taking a while. One thing when you're testing APIs, you can right click on the screen and hit inspect and you can hit console. It looks like it's still loading. Okay. That's for the fav icon.

It's still loading. All right. This is taking a long time. Let me see here.

Okay. So how it works user pace in the, the Instagram profile URL backend calls, AP via Instagram scraper to catch 25 most recent posts filters only videos with view counts sorts by views, descending returns top five with full metadata front end displays with the thumbnail stats and links. Oh, okay. Okay. Wow. So

we are getting an error. So I'm just gonna paste this error in here. I'm

gonna say everything worked besides the Instagram thumbnail or the image. It appears it's not working.

Please fix that. Okay. And after this, we're gonna add all of those other things, authDB and storage, et cetera. Something's coming in, something refreshed. These

are indeed the thumbnails for my videos. And that is actually very cool. This is very, very, very, very cool. And it shows exactly how many

very cool. This is very, very, very, very cool. And it shows exactly how many views it got. This is actually insane. Okay, so now I want to combine the two features in that the main feed, the default feed is I want the one where I paste in a URL link, like for the link to a profile and it pulls the top five performing ones. And so I want to do that, but

I also wanna pull the transcript for that video. So the same way we go from link to transcript on the other one, I want it to automatically do that after when I do the profile. So for all of the top five for the profile, I want it to load the transcript as well using the SupaData API. So

please just add the transcript there. please add a transcript button once it loads. And when I click on it, the card should expand with the transcript beneath it. Don't show them by default, just have a button show up once it loads. And yeah, after I press show transcript, when it shows the transcript, please

it loads. And yeah, after I press show transcript, when it shows the transcript, please make that button turn into hide transcript. And then next to that button, please add a little save icon that allows me to save it. We're gonna add that later once we add authentication and database. So just add that icon, it doesn't do anything for now. Okay, let's go. see how it does here. It is now done. Let's

for now. Okay, let's go. see how it does here. It is now done. Let's

go ahead and take a look here. I'm going to go ahead and paste this link right here to get the top five videos. We'll see if this works. So

this right here is pulling my Instagram profile, looking at my top my most recent 25 videos, ordering them in order of most views to least views, and then showing me my top five. Now that I think about this, I kind of wish it was just, just showed all of them. I think it's showing my top five and then it's also pulling the transcript for each one of those videos.

Okay, there we go. So this is showing all of them. Let's see if it shows transcript. There you go. Oh, this is a really short video. Literally, it's like

shows transcript. There you go. Oh, this is a really short video. Literally, it's like very, very short. We can see the transcript. There we go. Full transcript, full transcript, full transcript. That is very cool. Wow, this is a long video. Okay, so we've

full transcript. That is very cool. Wow, this is a long video. Okay, so we've created this Instagram scraper with the API and I actually really like this functionality. I'm

not going to change any. There's a lot of design things I want to do, but I don't want to get distracted. What I want to do is add off DB and storage and say, okay, I want to go to instant db.com. This, in

my opinion, is the best place to start when the best place to start when trying to add database and storage. I'm going to actually, I'm going to come here and I'm going to click new app and we're going to create a new app on instant DB. And let me break this down real quick. So We've added APIs and we have just a basic app with files. It's being hosted locally right now.

We're gonna host it on the internet in just a second, but we're adding off database and storage. And for all of these, we are going to be using InstantDB.

And this is like an alternative to Google Firebase or Supabase. In my opinion, it's better and it's really easy to get started. So we're gonna go to Claude and I'm gonna say, I'm going to go, let's just compact this. conversation and let's write out our next prompt. And by the way, compacting means you're basically summarizing the whole conversation and then it's clearing it. with the summary so that the context window doesn't

get too long. So I'm gonna say, okay, I want to add off DB and storage. Everything that's loading right now, I want to be able to

storage. Everything that's loading right now, I want to be able to save to my videos. So that save button should allow me to save them to my profile of videos. And I want to be able to filter them by creating. And so look at

the InstantDB docs. We are using InstantDB, so the thumbnail images should be stored as well. Please ultra think.

What I'm going to do right now is I'm gonna go to InstantDB. We're gonna

go into the docs and we are using React. I'm just gonna copy these links right here. Search the documentation and figure it out. All right, now

right here. Search the documentation and figure it out. All right, now it is thinking. Let's see if this works and we'll hit yes. One thing while it's loading, I do want to go back to this right here. Oh, new app, Insta scrape. Okay, wait, we need to copy this key. I'm just going to hit

Insta scrape. Okay, wait, we need to copy this key. I'm just going to hit yes, yes, yes, yes. I'm going to just going to stop it and say here is the public app ID for the app we are making continue. Ultra thing. Yeah. So here we have the Explorer, the

continue. Ultra thing. Yeah. So here we have the Explorer, the schema, and this is where all of the data will be stored. So notice here there's like nothing here, like there's no files, no users, nothing. Once this AI is basically setting this up so that all of the data can be stored here. And

I'll show you exactly how this will work once we start adding some data. This

is literally taking so long. Seven or eight minutes have gone by already. It's been

cooking for a minute. I think we are in business let's see um sign in let's see if this works okay sign in enter my email i'm gonna enter my email send magic code we're gonna go to superhuman insta scrape here's the code so now i'm signing in with this magic email code we're gonna enter the code verify code boom okay we're running into an error that's okay we're gonna copy this when

Signing in, I got this error after the confirmation code, please fix. Okay, so it's done here. Oh, the error is gone. So I'm

gonna try this again. I'm gonna sign in. I'm gonna put Riley at, okay, we can enter the code. I just wanna go through the full flow again, and this should send a followup email here. Okay, there we go again. Paste this in right here, verify code, okay. We are signed in. My saved videos right here. So we

have, now what I'm gonna do is let's go ahead and go to Instagram. What

I'm gonna do is I am going to go to Bryson, one of my favorite creators right now. If I copy this link right here, I'm gonna paste this in.

We're gonna get his top five videos. Okay, so that worked. Like usual, this works the same as before we added Authen database. So now I can just hit save.

Failed to save video, please try again. are still getting this issue. I'm just going to copy this. Wait, that's not the issue. I do not have storage permission. Okay.

So this is one important thing. I'm going to paste this right here. I don't

have permission, please fix or tell me what to put in the permissions in the database. Okay. So one thing here, um, AuthnDB, um, back to instant db there's this permissions tab and there's this rules.json and so i'm assuming here it's

going to search and then tell me what to put in the rules.json um the issue is that instant db requires permissions to be set up we need to configure the permissions so it's looking at the documentation deciding how this needs to work. I'm

gonna paste the rules into here and okay, here we go. Here are the rules.

So I'm gonna copy this. I may not even need to edit any of the code. I can save it. Good. We have to put Bryson's account here. Okay, so

code. I can save it. Good. We have to put Bryson's account here. Okay, so

the five videos are gonna load. Okay, so let's go ahead and give this a test here. I'm gonna hit save. Video saved successfully. I'm just gonna go do that

test here. I'm gonna hit save. Video saved successfully. I'm just gonna go do that for all of these. Save successfully. Right, we can show the transcript. Saved successfully. All

right, let's go and hit my save videos. Dang it, what happens if we hit refresh, my save videos. Okay, so that's very weird. What we can do is if we go into our Explorer, look, three things, were saved here. So we

have owner full name. These were saved, but they're just not showing up in the my saved. So we just need to tell Claude that, right? Let me explain that

my saved. So we just need to tell Claude that, right? Let me explain that again. I just hit save on those videos and they didn't save on this list,

again. I just hit save on those videos and they didn't save on this list, right? So I'm just gonna copy this link. And what we're gonna do is we

right? So I'm just gonna copy this link. And what we're gonna do is we are going to attach file. Now what we're gonna do is go to downloads. We're

gonna go screenshots. Please, can you look at the screenshot? I saved five different videos to the the database, like I hit save and I see that they're being stored in the database and we can actually just show them that like we can show the AI this by coming in here. We can see that they're in videos, they're showing up in the videos so we can attach this as another file,

right? We can go attach file and then paste this screenshot as well. And I'm

right? We can go attach file and then paste this screenshot as well. And I'm

going to say I included a screenshot of the database. The problem is, is that they're not showing up when I go to the tab, right? When I go to my videos tab, when I go to the, my videos tab, they're not showing up there as saved. So please figure that out. I'm going to stop it again here because I did just compact the chat and I'm going to say, please make

sure to look at instant DB docs for this.

And I'm just going to type in the, um, Yeah, I'm just gonna make sure if you need them. Okay, so it is done. Let's just save and save my save videos. There we go.

Okay, so let's see if this works again. Save, okay,

cool. My save videos, boom. It saves with the transcript. Now in

theory, I should be able to refresh to my save videos and there we are they're persistent they should be saved in the database and so if we go to instant db.com we go to the dashboard we can see here that go explorer oh wait no we need to go to instant scrape explorer videos

oh i just figured out the problem saved by user id so all those other times i was testing it it wasn't showing up in the database. This is

really good. So you can see here, it wasn't saving the user ID. So when

you create an account, it gives you this user ID and that is how it shows up in the right section, right? Because right here, it's only showing this user's saved videos. If I were to sign into someone else and save them, it would

saved videos. If I were to sign into someone else and save them, it would only show theirs. And so it wasn't saving this saved by user ID thing. And

there we go. There we have it. We have an app that allows us to paste in a creator's name, and then it shows their top performing videos, right? I

can show you once again. We can go to Instagram. Let's go to one of my favorite creators right now. Let's go to RPN, Roberto Nixon. We can copy this.

We can paste this directly into our app, get top five videos, and boom. There

we go. We have all these videos right here and we can show the transcript.

Social media is dead. There's no social media anymore. It's consumption. It's a status game.

This is great. So now we can hit save. We go to my save videos and boom. Ideally, if we typed in RPN, there we go. They're even sorted. Bryce,

and boom. Ideally, if we typed in RPN, there we go. They're even sorted. Bryce,

now it should only sew Bryce. There we go. We have this app. It's called

Insta Scraper. One thing I wanna do before we're done here is I wanna make it a little bit cleaner. I want all of the functionality to remain the same. I want the input area, the input field to be vertically centered on the app. And actually before we do this, what I

wanna do is I actually wanna go to GitHub and I wanna save my code where it's at. Like I wanna save it right now. And so I'm gonna hit new repository. I'm gonna choose myself as an owner. I'm gonna call this Insta Scrape.

new repository. I'm gonna choose myself as an owner. I'm gonna call this Insta Scrape.

I'm going to make this code private for now. I'll make it public later if you want to fork my repo just because I have private keys in here. I'm

gonna hit create repository. Now what I'm going to do is I'm going to copy this GitHub repo and I'm just gonna open up this cursor side window and I'm going to say okay please can you push this code to this repo that I made and this should push all of the code to this repo and then it will show up in this feed right here and boom there you go okay

so it was just pushed to this repo I can hit command R there we go everything is saved now what we can do is I want all functionality to remain the same I want the input field to be vertically centered on the app just to make it look better please make the sign in slash out in the top bar along with the name of the app

change the name of the app to create dot ink. Just

put that at the top. That is a domain that I wasted a lot of money on that I still have. Put top left. Please make the three buttons. So

instead of these, make them paste a transcript, paste video link, paste Instagram profile link. These two should be in a little drop down in below the input area. Please put my save videos somewhere else. Use your best design

sense to make this better. Use white, grays, and black. So we are kind of doing a little redesign. Okay, look at this. I believe it's done making a change.

You can sign in. Database, there's data stored storage. Those pictures are being stored in the database as well. And then we're using many different APIs. We're using SupaData. SupaData,

which pull, which allows you to go from profile to links, right? To like, we can see all the videos and then we are using,

links, right? To like, we can see all the videos and then we are using, oh no, that's where we're using APIify for that. And then we are using SupaData, SupaData to go from the Insta link to transcript. And

yeah, that's exactly what we're doing here. And that's what we've created. Now I can save all of these videos And if we go to my saved videos, we can see all of them right here. I can go RPN and here we have all of the videos saved to a database. And this site is looking good.

It's very simple. We can paste a video link, paste Instagram profile link, and we can save them to a database right here. That is what we did in this video. We went over all of these. Okay. One thing I didn't cover in this

video. We went over all of these. Okay. One thing I didn't cover in this video that I'm actually, I'm tired. I don't want to go over this cron jobs are like things are basically things that you could do on a schedule. So imagine.

we added a feature which we could do. Imagine if we had a list of creators that we wanted to follow and then every day at 10 a.m. it automatically

pulled this data and for us to see. So like the home screen was like a feed of all my favorite creators videos and I could save them and it happened every day at 10 a.m. That would be a cron job but I'll actually talk about that deeper in a future video. I think this is a pretty good start. I am going to, I think add payments to this in a future So

start. I am going to, I think add payments to this in a future So if you want to see that, go ahead and hit subscribe. And in the next video, I think I'm going to be adding payments to this. Also, if you go to vibecode.dev slash learn, you can actually sign up for the course that I'm releasing on January 7th, 2026. It's gonna be the biggest course. We're gonna

talk about Cloud Code, Codex, Vibe Code, Cursor. We're gonna build mobile apps and web apps. And by the end of the course, you will have an app on the

apps. And by the end of the course, you will have an app on the Apple App Store. And we are gonna be Vibe Coding production ready apps that you can make money. You're gonna get an app on the App Store that you can actually charge real users because that's where we are right now. AI is getting really good at auth and DB, like we talked about in this video, and it's getting

better at payments. And that's what our team here in San Francisco at the Vibecode app, we are heavily focused on getting payments integrated into our app and getting AI to make apps that allow us to make money. And so if you get this guide, it'll lock you in for a heavy discount on this course. That's going to be January 7th, 2026. So we're three months away from it. And so make sure

to sign up and get the free guide.