Google AI Studio Just Ended the AI Coding Race (gemini 3)
Let's learn how to use Google AI Studio (gemini 3)📅 2025-10-24
Transcript
[00:00] Google AI Studio to build out a full production app. Is it possible? To put simply, it is. And I'm going to show you in today's video. The software we're going to be creating together is going to be a thumbnail editor. Therefore, by the end of this video, not only functionally are you going to see how to actually build out real software using Google AI Studio, but I'm going to go as far as open sourcing the entire code repository so you can just clone it, start it, and have your fun. If that all sounds good, let's go ahead and jump in the video. Welcome back, y'all. Oh my gosh, y'all. The amount of people requesting for my other video to do a video on this topic was a lot. So, my
[00:32] objective is pretty simple here. I'm going to take this random screenshot of another video I did and I'm going to make it into a legit professional thumbnail. Don't believe me? You could probably scroll to the end of this video and be like, "Whoa, whoa, how did he get there?" Trust the process. I'm also going to take this one step further here where this gets deployed to a actual website link you can access. So, not only do you get the free source code, you also get the free website. I love it. We're going to use the power of Nano Banana powered app. If you were not bullish on vibe coding, you are bearish. Then oh my gosh, you are getting absolutely shorts squeezed right now. Look at this prompt. I want you to build
[01:02] an app which entire purpose is to be my thumbnail editor. Therefore, all image outputs will be 16 by9. That's a nice little horizontal thumbnail thing you always be seeing. And will be optimized for YouTube style thumbnails. It my bad. And it will be a chat back and forth system. Eg. I want you to remove background. You remove background. Okay. Put me in space, etc., etc. With that simple prompt, I'm going to hit build here. And we're gonna keep doing iterations until this is perfect. And then once this is perfect, we're gonna put it to a real website link. And I'm gonna give you that code. Free code. Hashtagode Corbin. You already know. This was my first shot at it, y'all.
[01:34] Let's go and upload the image. All right. Not bad. Let's do the first thing. Let's just say remove background from me. Enter. I don't expect this to work on the first shot. If it does, then this genuinely tells you how far we've gotten, y'all. But let's see. Um, this is impressive. So, I got the first one down. Spot on. But can I do a follow-up message here? So, my follow-up will be, you know what? Maybe I don't want to be so cold anymore. You know, Northern California is too cold. I'm saying, make me wear a Hawaiian shirt. I'm expecting this to break. I I've never seen
[02:04] something get so spot-on so early, y'all. Come on. Oh my gosh. We are in a different age, y'all. Okay, so this might literally just get it to the point where we just need to go to production because it is working on the first shot here. Let's try another prompt. This prompt's a little crazy, but watch it. Make it so what's on my phone is a Google stick figure saying it's vibe coding time. It's very abstract, but I'm imagining like a doodle little stick figure. Maybe like the Google logo on the face saying vibe coding time,
[02:38] y'all. Y'all thought this was a game, y'all? Really? Oh, yeah. New tool came out. Uh, what? I've been creating content on this topic for the last three years, y'all. This is by far the most impressive, fastest tool I've seen in the space. What I just showed you right here, a ton of errors would have happened if this was a year ago with any type of coding tool. I mean, at this point, let's just do the the last prompt here, right? Put me at a beach. People surfing behind. Enter. I almost want to make the thumbnail of this video this right here, but I'm not going to do it. But look at
[03:08] y'all. We could keep going, I bet. Look at this. Give me a slight shadow and make me smile. Oh, this is too much fun. W. Okay, let's push this to prod. Wait, before we push to prod though, we'll do a little bit more nuance here. I I do want to kind of build this out a little bit more because I'm just so surprised how fast and how far we got with the first shot here. We'll do a couple things. Look at this. Google, chill out. It's giving us suggestions. Add image export. Improve prompt suggestions. Add zoom and pan. We're adding all this image export
[03:39] first. Boom. Go. Shoot. Just like the picture. We're surfing. We're vibing. So, now we have the ability to export an image. But before we dive back into this user experience again, let's just get all these suggestions and see what happens here. So the next one, let's add a history mechanism here. Implement functionality to store and display the chat history. Each message should include the user's prompt and the AI generated image response. Persist this history using local storage. Nice. That's pretty cool. It went ahead and opted for local storage where we essentially store the data on the user's browser. Obviously, we can connect this to a back-end database like Firebase or
[04:10] GCP if we wanted to. In my series where I show you how to build out a software from scratch, I actually use the same type of logic here of local storage just so it's very lightweight. I don't necessarily have to pay for a backend for a free service like this. This is tube stamp put in a YouTube video, get timestamps out. But the idea is it was pretty smart for Google AI studio just to opt for this right off the bat. What we can do then later on is integrate that backend service of Firebase to make sure that we have a live database that it can communicate with. I mean, this is already so impressive that I bet the extra steps of creating authentication, logging in, logging out with a user would be extremely easy due to the
[04:41] nature that this entire product is ingrained in Google's ecosystem. Let's push it here though a little bit. Let's see if it can do a complex workflow that would require AI to analyze an image and then implement it within the nano banana thumbnail. Nano banana. Who made up who made that up? Google, someone got to tell me who made up the name for nano banana. Is there lore behind that that I'm not aware of? I'm going to say add the ability for me to upload an image as context on what to add just to give a little bit more information so this works correctly. I'm going to say while we are in a chat over a thumbnail. Idea being we're editing our thumbnail and we're like you know what I want to add
[05:12] an In-N-Out milkshake in my hand, but I want to give vision context the ability to understand how I want the In-N-Out milkshake to look. And now that I'm saying that and I had In-N-Out yesterday, let me grab that image. Oh, these are so good. If you've never had the chance to ever eat at In-N-Out, it is hands down the best burger place. Fight me. They just kept this simple, you know. The prices are still good. The fries are super good. And I love how they just have those little yellow banana peppers. You can just get as many as you want. I might actually have to go I might actually have to go eat that right now. So, while this is cooking, I'm going to
[05:43] make sure I save this app as I would not want to lose my progress. Really nice. You notice that we now have the ability to attach files here. But first, we need to upload a thumbnail. Round two. We had some iterations. Gemini helped me out. Upload image. Okay, we got an error. for a second there. I'll be honest with you all. I was a little worried. I was like, "This is too good." Let me hit inspect here. Let me go to console. Okay, so we got an error. Let me go and just copy all this. This is a really good strat for anyone that's vibing that knows how to deal with errors when this happens. Just copy all that right there. Paste it over here and be like, "What's what's happening, AI? Help me out." For a
[06:14] second there, y'all, I'm not even going to lie to y'all. I was like, "This is this is getting too good." But we got an error. My job is safe. All right, we're going to let it go ahead and figure out this error. And you just figured out how to troubleshoot in Google AI Studio. If you've been using Google AI Studio, let me know in the comments what y'all have been creating. I saw someone quite literally deployed a fully functional app within two hours. Pretty crazy stuff, y'all. All right, round two. Upload image. So far, so good. We can actually change the image now. We have the ability to download. First thing for any good thumbnail editor is we got to remove the background, right? So, I'm going to say remove the background from me. Enter. That is hilarious that I was
[06:45] actually happy to get an error in code. All my years of coding, I've never had that feeling of like, wait, give me an air. Show me something's broken. That just shows you how far we've gotten, y'all. Okay, so I messed up a little. So, we're going to retry this. And in order to solve that, let's actually add the functionality of add, undo, and redo. Nice send prompt. Cuz right now, I'm headless. I guess I can go right here. It finished that request. Upload thumbnail. And before we see it work or not work, I know some of you are watching this on X right now. So, I'm going to just wait. Hit that follow.
[07:16] It's that it's the button that says follow. Fresh content every single day in the description down below if you're watching on YouTube as well. X Corby Brown. All right, let's see if it works. Remove background. Oh, I might need to be more specific there. So, we'll see. Oh, I got to save this. Y'all ever play a video game like Skyrim? You get super far into something and you didn't get a checkpoint. Mm- So, now we got to see if it's able to get me my little In-N-Out shake. Major tip, you can mix it. So, if you like chocolate and vanilla, just ask for chocolate and vanilla. Come on. I'm going say replace the phone with this In-N-Out milkshake attachment. Really
[07:49] good UI, y'all. I love this UI. It gives the metadata of the image itself, which is like a screenshot. You can see the image. And let's see if this works. Oh, it actually puts it in chat as well. Holy smokes. What? Oh my gosh, y'all. Is it This looks like it's like some type of advertisement. It gave me a Look at Look at that. You y'all got to understand I got a super long waist. Super long. Like, look at this. Like, what's going on? my whole my whole torso. This is awesome. This went Tik
[08:20] Tok mode on me. I might have to post that. But as you can see, it was able to one really understand that I wanted that in-n-out shake. It was green. And what I mean by that is the exact image I provided was the green in-n-out shake. And it's just a super cool angle. Y'all, let's say I messed up though. Let's check out undo. Okay, that worked well. And let's test out the new feature. New. Nice. So, now that we have an app that works and it's a lot of fun, let me connect this to GitHub. Save to GitHub. And y'all remember yesterday's video. You sign, save, everything looks good. Let's try a
[08:51] repo name. I'm just going to call it thumbnail editor. YouTube thumbnails. Easy. Make it public. Create git repo. Google, this product is beautiful. I love it. It's amazing. Something's up with this integration. A lot of us are having issues with this GitHub integration. Please help. Someone someone put in the comments. Someone put in the replies. Google, where you at? Where you at? Wa. All right. This is the old fashioned way. We're going to download the code. I'm going to simply hit download app. Now that we have the code downloaded, let's create a repository. This repo, we'll call it YouTube thumbnail editor. And we'll say we just vibecoded your new editor.
[09:22] #freeode Corbin create repository. With this done, I'm going to simply copy the SSH link. I'm going go to the project, open up into VS Code, cursor, winf, whatever you like to use. And once we open up the code, which is that nice little folder. I'm going to simply say, okay, connect via SSH GitHub. That link that we just created together. Make the first commit like and subscribe. I don't know who's telling you to do that. The AI model told me to put that. As you already know, this channel, make sure to check me out on GitHub. Throw a follow as what I do is very simple. Free source code every single week. Just download it. #freecode Corbin. It's been connected. And our first commits right here. Like and subscribe. Like and subscribe. Like and subscribe. Like and
[09:54] subscribe. Smiley face. And if you want to learn how to download that code, cuz some of y'all might be like, Corbin, this is awesome. I want to do something with it. But what the heck is GitHub or how do I download? I'm going to leave a 46minute video in my YouTube description. Entire big series made by me, me, myself, and I, not that GE song, showing you how to use GitHub and showing you how to use it effectively. Just to download the code, steal my code. But now that we've attached our code to this repo, we have version control. And then once we can connect to GitHub, we can go push back and forth. It would be very, very beautiful. What we can do now is deploy the app. Hit deploy app. It will then prompt us to choose a cloud project. All I want you
[10:24] to think about when you hear cloud project is this is our back-end services to functionally run a website or do actions. So Google's ecosystem that's GCP and they have a nice little thing called Firebase. I absolutely love Firebase. A lot of my videos on this channel go over how to use Firebase, but they work hand in hand. What I'm going to do is hit create project and I'll put the name YouTube thumbnail editor. I like keeping the name similar in the sense of the local code I have on my computer, GitHub repo, the underlying project. In real software development, you would be incentivized to create two different environments. Eg YouTube
[10:56] thumbnail editor QA and YouTube thumbnail editor prod. Obviously, prod is production. This is where you put a live website where everyone in the world accesses it. QA is a duplication of that. Other people call development, whatever you want to call. I like doing QA cuz it's shorter, but QA makes it so that we can make functional changes in the cloud, see if it works. Once it works in QA, we then can push to prod. If that didn't make sense, don't worry. Just create a project, call it a name, call it something like awesome, great, amazing app, create project. Once we do that, we need to set up our billing. You'll be prompted to add a billing account. So, you'll link a billing account. Once you link your billing account, and for more context on how GCP
[11:27] and Firebase bills you, it's a pay-per-use basis. They're pretty generous when it comes to their free plan and giving you a ton of requests, a ton of deployment. One of my original series on this channel was I showed you how to build a website from complete scratch. It still exists. It's like how to create a frontend using AI. It's in my courses page on YouTube. But I use Firebase here. And the reason I use Firebase is that you could quite literally host a website and the only cost associated is like $1 a month for the domain you purchased. Now, that's assuming you don't hit the threshold of like 50,000 active users a month or
[11:57] something like that. Don't quote me on that. Just look up Firebase quota plans. So, that's selected. Deploy app. Now, one thing I want you to notice, y'all, while this is deploying one, for context, if you've never deployed something before, the what's incurring here is that we're running all the relevant functions. We're building the front end. Essentially, it's just compressing all this data in an optimized way to serve it to you. Like, YouTube's gotten so good at this obviously, that they could have all these different videos and you have no issues with the actual underlying production URL. Point being though, one thing that's very clear to me that the Google AI Studio team is doing, which is pretty cool, is they really are making
[12:27] this like general public friendly that anyone can code. the fact that it goes the extra step here that it will make it so that your API keys, if you use them in the app, it will make sure they're not exposed. API key, your ability to access Gemini API and all these different APIs and actually get payer use. Think of it like any other API key for any other service. Also, as a real quick side note, some of you are like, Corbin, why are you explaining these like very simple developer terms like I'm 5 years old. I'm sorry. Some people don't know. Some people don't even know what GitHub is. I do this so everyone can understand what I'm saying. Okay, don't get mad. Don't be the Grinch. Don't be the Grinch that stole Christmas. Don't be the Grinch that
[12:58] stole code. And with that, we can view it. View app. And holy smokes, y'all. This is a live website link. And we can actually use it now. Upload image. Make the background the moon. And boom. We are in the moon. So, we've successfully deployed this to a production environment. And the first thing some of y'all might be saying is, Corbin, I don't like that URL. How do we take this to the next step? This is when a back-end service like Firebase could integrate flawlessly. Google has gone the extra step here or pardon me Google
[13:30] AI Studios team the specific team has gone the extra step here of all the way to max deployment in a GCP environment and a project. The last bit of leg room here is essentially connecting this to Firebase and having a cool easy UI to work in. Let me say a couple things on that topic. The first thing I want to say on that topic is that this playlist, this playlist, and this playlist all use Firebase, all use GCP and can show you everything I just described there end to end in a real production environment. Eg tube stamp what I just talked about. That's the one we built in the create a
[14:00] software from scratch series. But here's what I'll do. If I get enough demand and enough of y'all are like, Corbin, enough of you just referencing these old series. I don't want to watch these. I don't want to watch the old you. Okay? I want to watch the new you. If I get enough demand, I'll show you how to take that project right there, connect it to Firebase, push it to a domain that you purchase, like the whole 10 yards. Just let me know in the comments, okay? Cuz sometimes I'll be making these videos and like some of y'all like, Corbin, this was not necessary. Okay, my bad. My bad. Last thing you should check out here is my school community is completely free. I want you to think this like a Reddit form. If you run into issues, you hit milestones. We are
[14:31] builders. We love building. Building is fun. That's the whole purpose of this community. So sometimes my videos are inspired by what y'all request. Therefore, if you really wanted something very specific built out and you can't find it anywhere on YouTube, simply just make a post here. That just about does it, yo, cuz as you already know with these style of videos, I'll see you in the next. Did Google AI Studio get so good at vibe coding that I was actually worried for a second that I wasn't getting errors, therefore causing me to have a weird kind of dilemma in my head cuz I was coding since I was 12 and I was like, wait, wait. Every time I see an error that's supposed to be a bad thing, but I actually wanted to see an error because it was scaring me because AI was getting too good at coding type of video.
[15:04] The fries are super good. And I love how they just have those little yellow banana peppers. You just get as many as you want. I might actually have to go. I might actually have to go eat that right