How To Build An App With AI (no experience required)

in this video I'm going to teach you how to build your first application just with AI no programming experience necessary it doesn't matter if you've never wrote a line of code in your life by the end of this video if you stick all the way through you'll have your first app and on top of that you'll be able to program more apps by yourself no help required let's get into it boom I'm over here now let's get right into it what I'm going to show you how to do today is build a Todo app through JavaScript no coding experience necessary really easy to do and all you'll be doing is using AI the AI is going to teach you how to write the code it's going to teach you what the code means and it's going to give you the skills you need to then go and build other applications yourself again beginners can do this no coding experience necessary and this will put you on a path where you can start building your own applications that you can then turn around and sell or have others use so what we're looking at here is on the left is a site called repet and on the right is AI I'm using grock 2. 0 but you can use whatever you want if you want to use chat GPT or Claude you can do that any of them work uh I just like to use grock it's the newest model grock 2. 0 at the moment this video came out so on the left hand side is repet what repet is is a place where you can put code and run it completely free on the internet uh it's the best beginner friendly way to write and run code I like to use it completely free easy to use so what you're going to do right now first is sign up for repet pause the video link down below completely free create your account come back and we'll start building code okay welcome back here we are let's do it so now that we're in repet we're going to create a rep down here it's going to be in react JavaScript uh react JavaScript is a programming language that a lot of big companies use today it's one of the fastest ways to build and deploy applications if you learn these skills here you can very quickly turn around and build a lot of other different applications let's give it a name we'll name it AI to do app and we will create it now our environment is set up on the left side to put in code we get some basic code set up for us here uh and then what we can do is if we go to console we can then click run and what's going to happen is it will run the code for us and so what you can see here is your basic boilerplate react JavaScript code all set up for you as you edit code over here on the left you'll get the results in real time on the right this could be a little intimidating don't be intimidated we're right at the beginning what we're going to do now is switch over to the AI over here and we're going to start using it to teach us how to code teach us how to build this app and get some really cool results really quick so I'm in grock again you can use anything you want if you want to use chat GPT if you want to use Claude it's all up to you they'll all be doing the same thing I'm just using grock for this and what we're going to do is we're going to say hi grock I always say hi to to my AI as I'm building things out you got you got to have your manners you got to have your manag one day they'll be more powerful than us and can kill us so you got to make sure you say hello and thank you and all that hi grock uh I'm a brand new programmer and I'd like to make and by the way this prompt will be down below in the description uh if I'm you I would actually type this out yourself not just copy and paste it uh a big thing here is you know you I want you to also learn how to prompt with me and use Ai and get better results so if you manually type this in yourself you're going to learn prompting skills while you're doing this too so follow along with me while I do this and then you can pause and prompt yourself and change the prompt if you want but here we go hi grock I'm a brand new programmer and I'd like to make a Todo list app using react I've never programmed a line of code in my life before so if you please can help me out here but also teach me step by step what you're doing so I can then build other applications myself please make this app simple so that I can then customize it any way I want so what we did here is we set the state with the AI on what we're trying to do what our background experience is It's always important when you're prompting AI especially if you're going to be building applications uh letting them know what the situation is what your skill levels are and not just to build it right if they're just building it you're not learning anything here so what I'm doing is I'm explaining what my skill level is and what I'd like roock to do which is teach me along the way so that I not only just spit out a bunch of code that I don't know what is doing but also I learn what it's doing so I can customize and build myself uh and build my skills as well and real quick let's also make sure that we let grock know we're using repet so the AI know about all the websites and how they work it's pretty amazing how they work actually so let's go in here and also make sure they know that I'm doing this completely Onre awesome now we can run it so what we'll get here is we'll get a guide from grock on how to build this application from repet step by step right so it's going to tell us exactly what we need to do uh we can skip most of this cuz I got this most of this set up for you already but let's go into the basic structure so it's going to teach you about the basic structure of a react application again react is a really awesome framework for JavaScript basically makes it very easy to quickly spit out applications ship them launch them and get people using your apps it's going to tell you about the code structure over here on the left the different files what they each do I definitely recommend taking the time to go through this and learn about what each one of these do um but what we're going to do here is we're going to go into the main part of the application uh which is app.

jsx this is the code you see here so if I come into app here and I say uh subscribe to Alex Finn and then I save it what you can see is Boom immediately updates uh what you see on the application in the web view so pretty PR cool so this app. jsx this is going to be your main file where you're going to do all the code editing as explained by grock here um so what I'm going to do is copy over this code I'm going to drop it in here so you can get a taste of what the kind of basic app code does spit out from grock so this is the basic to-do list and we can do to-do item one and add it and so what you can see is all the items you add your to-do list go under here so this isn't obviously good enough this gives us an application but we don't know how the hell this works or what the hell it's doing since we're beginner programmers we really want to understand line by line what's going on here so what we're going to do is we're going to go down here it's going to give us some basic styling it's going to tell us the exact app file to put that in and put that in here update it o looks makes it look a little prettier and then now what it's going to do is start explaining so let's do this let's say start with app . js please explain line by line how this works so I can truly understand the code I'm writing here my goal is to become proficient in react so I can build other applications and so what we're doing here is we're now having a conversation with the AI uh to learn what it is it's having us do so we can learn how the code works so that after this we can a customize this Todo list to our liking and then B build other applications maybe applications we build ship and start selling and making money off of so let's hit enter on this and now it's going to break down app.