Google Antigravity Tutorial for Beginners: Build Your First App (Step-by-Step)

Look at the left screen. That was me yesterday  staring at a blank cursor trying to remember   how to set up a basic web app. Look at the right  screen. This is me today. I'm drinking coffee.    My hands aren't on the keyboard and Google's  new AI anti-gravity is building the app for   me. Hi everyone, I'm Jamie and welcome back. If  you've been hearing the buzz about AI agents and

felt a little intimidated, you're in the right  place. Today we're going to be diving into Google   Anti-gravity. This isn't just another chatbot that  gives you code snippets to copy and paste. This   is a Gentic IDE. That means it can plan projects,  create files, run terminal commands, and even open   a browser to test its own code. And the best part,  you don't need to be a master corder to use it. By   the end of this video, you're going to build your  first working application completely from scratch   just by asking for it. Let's jump in. Step one,  head over to anti-gravity. google. I'll put the

link to this in the description as well and grab  the installer. As for right now, early 2026,   it's still free for individual use. You can see  I'm on Windows right now, but if I click on this,   it will bring me to where you can see you can  download it for Mac OS, Windows, or Linux. Go   ahead and get it installed and then you can follow  along with me. When you get it installed and first   open it, you're going to just walk through some  setup. And as you see, we can go next. We're going   to start from fresh. X. Pick the different theme  type you want. I'm going to stay with dark mode.    Hit next. How do you want to use the anti-gravity  agent? I'm going to use this one right here,   the recommended one, but again, you can choose  what you would like. I'm going to choose next. I'm   going to keep this one as normal and recommended.   And then you do need to sign in with your Google   account. And then you'll see a anti-gravity  term of use. I'm going to make sure I have that   selected. Hit next. And we're there. Ready to get  started? Once you download and open anti-gravity,   the interface looks like VS Code, but there's  some hidden controls that you need to know about   immediately so AI doesn't run wild. Go down to the  bottom right hand corner. You'll see a button that   says anti-gravity settings. Click that. This menu  controls the AI's brain. There's two settings here   that are critical for beginners. First, look at  auto execution. This controls things like terminal   commands. If you set this to request review, the  AI will ask permission before installing anything.    If you trust it, you can set this to always  proceed to speed things up. For this tutorial,   let's just keep it on request review so we can see  exactly what's going on. Next is review policy.    This is the most important one. This controls  whether the AI can change your code files. So,   warning, don't set this to auto yet. Keep it  as request review. This ensures that AI acts   like a junior developer. It has to show you the  code before it saves it to the hard drive. Okay,   safety checks are done. You're now the manager.   Let's hire our agent. One quick interface tip   before we get started. You'll see right here we  have open agent manager. I'm going to go ahead and   open this. Think of this as mission control. It's  where you go if you have five different agents   working on five different projects at once.   But for this beginner's video, we're staying   right here in editor view. This is the job site  where the actual work gets done. Let's go ahead

and stretch out this right panel. Notice you can  change the views up here. If you want to toggle on   or off or change where you want things, go ahead  and make those adjustment. Here on the right side,   we have our agent chat. We're not going to build  a hello world. We're going to build a Pomodoro   timer. I'm going to be using the Gemini 3 Pro.   Here you can see how you can toggle between the   different ones. This is the prompt that we're  going to give it. Create a modern web-based   Pomodoro timer. It should have a large 25minute  countdown display and start reset buttons. When   the timer hits zero, play a notification sound.   Use HTML, CSS, and vanilla JavaScript. Let's go   ahead and send. Notice it just doesn't start  coding. It makes a plan first because we set   a review policy to request review. It pauses  here. It's asking, I wrote this code. Is it   okay to save? You can scan it, but for now, let's  trust it. And then click accept. Now, we can check   out the implementation plan over here. We can  see we have the different things I asked for,   the HTML, the CSS, and the JavaScript. Here,  I'm going to go ahead and just tell it this,   you know, looks good. Proceed. And now you can  see it's moving the from the implementation plan   approved. Now it's moving to execution. Now at  this point it's saying that it would like to   use my browser. So there is a quick setup for  this as well. I'm just going to go ahead and   click on setup and I'll scroll down a little  bit and I'm going to install the extension. Now, this is like magic here. So, you can see  right now the agent is actually going to be taking   control of the browser to test everything out. And  then I'm going to get prompted back and forth uh   to uh whether I need to confirm things. So, look,  as I go back to the screen here, I'll hit confirm. Now, I can see that the agent is actually  running the clock. I'm not doing anything   with the mouse. You can see as it comes up,  the agent is testing it out. And at this point,   it needs for me to confirm it. So, I go back and  forth a few times with just confirming different   parts of it as it's testing everything for me.   All right, it looks like it's all done here. So,   what we're going to do is just watch it finish  up and you're going to see over the left hand   side that it will come up with a screen capture  of the testing that will be placed right inside.    So there it is. So it will I can check to see that  it's been tested out and things are working on it.    I just find that so amazing to watch how it could  takes control of the browser and then even gives   me the screen capture after inside of this. Now  you've probably noticed a number of different tabs   appearing. So right now this is the walkthrough  tab that we're in and we could go back a step.    This was the implementation and I believe there  was even task there. We can see the different

coding from the HTML to CSS or the JS here. Now,  if we kind of just take a look at this code, you   can see it generated the Pomodero timer. Uh, it's  really organized. If we look at line two right   here, you can see where the 25 minutes is the  default duration on this. If we just kind of take   a quick glance around, if we look at this right  through here, we can see this is where it handles   the complex math for progress ring animation. Uh,  but right now that 25 minutes is hardcoded. So,   let's go back to the chat and ask the AI to make  this customizable and add some sound effects to   it. All right. So, in the chat, what I want is  to add two specific things. A sound effect for   when the timer finishes and a simple input box  so I can type my own duration that I want. So,

this is what I'm going to write. Update the code  to a sound effect when the timer hits zero. Also,   add an input field in the HTML so the user can set  a custom time in minutes. I'm just going to tell   it exactly what I need in plain English. Notice  I'm not telling it how to write the JavaScript.    I'm just describing the feature. Let's hit  enter and see how it modifies the class we   just looked at. Now I'm going to jump back over  to the implementation plan and I can see where   they're suggesting add, you know, to modify here  what I suggested. And I can see that it's going   to play a sound at 0 0. So, I'm just going to  say looks good. I'm going to go ahead and accept   all. And I just need to confirm and I'll accept  all. You can see that there's a list right here,   the step by step that the agent's going to do. So,  it's going to be numbered 1 through 15. And if I   go ahead now and open up the uh actual browser,  you're going to be seeing the same thing that I   showed you before. So that one of the steps was  that it was going to be set to one minute and then   it's just going to time down from there and it's  going to go back and forth and ask me to confirm   it just like I did the last time as it test  everything out. Now a quick real world warning.    Sometimes when the AI tries to open the browser to  test itself, it might hang or spin for a bit. If   that happens, don't worry. You can just cancel the  action and open the browser manually. Remember,   this is cutting edge software. It still gets a  little confused sometimes, but when it works,   it feels like magic. And if you'd like to  review the changes, you can see right here,   if I click on it, it's going to open up this  tab here. And you can see where it's made   modifications to the HTML files in this case. Now,  I did end up cancelling this because it was taking   forever and just spinning and spinning. And I  just resent it off again. And now it's working   through. I can see that uh it is working here that  I can confirm and continue on with the coding here   that it's doing. We have a view part here. So I  can take a look at the focus timer uh that opened   up in another tab over here. So I let it go for  about 2 or 3 minutes and it went back and forth.    It had some errors. It fixed it itself. I did  have to hit confirm a few times in it. Uh but you   can see what we're watching is the playback of it  going through and testing everything. I didn't do   any of the testing. It tested it out itself. And  we have the walkthrough just like we had before. Okay, I have this opened in my browser. We  can give it a quick test. I'm not going to   put 25 minutes in here. I did want to say I did  accidentally close down my browser and then I   just told it I said open in my browser again and  then it gave me the link to open it back up. So,   if I go ahead and I'm going to put one minute  here. I'm going to hit start and everything   seems to be working. But then I'm going to jump  ahead and we'll see how it works at the end for   the sound. Okay, so I'm down to the last few  seconds here. We'll see if we get a sound when   it reaches the zeros. That was a nice sound. And  remember, I could go back and ask it to change to   a different sound. If I hit reset, this seems  to be working. And I can go ahead and add any   changes to the time. I could go back and ask it  to make it in a different color, different style,   all by just having that natural conversation  inside uh anti-gravity here. So, how do we get

these files online that we created? So, we have  these three different files, the script, the   styles, the index. Right now, everything is stored  locally, but we can go ahead and upload those. You   might think if we go up top here, you'll notice  an export. This is a little bit different than   what you would think with an export. So, this  export is going to give you a markdown file. So,   that's great if you want to save the transcript of  how we built this. Sort of like saving a recipe,   but I don't want the recipe. I want the cake. I  want the actual website files to put online. So,   as I mentioned, since this runs locally, I don't  need to export the code. It's already here. And if   I look up, I'm under this one open here. I can see  the path they're giving me right across the top   here. So, if I just open up my file explorer here,  I'm going to go to this PC windows and it's going   to say users. So, at this point, I'm at my name.   So, I pick my name. I can see Gemini right here.    I can see anti-gravity. I can see Scratch. I just  go down to this one. And look at this Pomodero

timer. So, what do I do this? This is where this  is where I need to upload these file or this whole   folder because I can see the three different  files are in here. So, this is where I'm going   to bring in this to test it out. So, this site  right here is called uh Netlefi. All I have to   do is drag and drop over. So, in this case right  here, I have this folder. If I had website online,   if I had one, I could bring it over to. But  this gives me a place to test this out. So,   I'm grabbing this folder and I'm going to bring  this over here. Now, I'm just using the free one   right here. And it gives me the link right here.   Your project will be live for 1 hour. So, I could   sign I could send this to somebody um and then  they could do get take a look at this, but they   would need this password right here. So, I'm just  going to copy this. I'm going to click on this and   I'm going to give it the password and hit submit.   And look at that. I don't need to save that   password. We have our timer. I can go through and  test it out to see how it's working and everything   that we tested out locally. So remember, this  is online. So if you had a place to host this,   you could work it that way. So going from what we  did in just a few minutes to create this app to   all the way to putting it online. So there you  have it. In just a few minutes, we went from a   blank screen to a fully functional custom Pomodoro  timer hosted live on the web. What's crazy is that   we didn't write the JavaScript oursel. We acted  more like a project manager. We told the AI what   we wanted, reviewed the code, asked for changes,  and then shipped it. If you create something cool   with this, let me know in the comments.   I'd love to see what you created. Thanks   for watching this week on Teachers Tech. I'll see  you next time with more tech tips and tutorials.