I learned how to vibe code for you. So, here's the cliffnotes version to save you the hundreds, actually probably at this point thousands of hours I have spent watching YouTube tutorials, taking courses, but honestly, mostly just like trial and error as I'm developing my own applications through vibe coding. Vibe coding is seriously a gamecher and has fundamentally changed the way that I code and develop apps. Which is why in this video I'm going to be focusing on the fundamentals, the frameworks and the principles of good vibe coding. Then I'll also teach you how to apply these principles of vibe coding with any tool. As per usual, it is not enough just to listen to me talk about stuff. So throughout this video, there'll be little assessments. And if you can answer these questions, then congratulations. You would be educated on vibe coding fundamentals. Now, without further ado, let's get going. A portion of this video is sponsored by Brilliant. All right, here's the outline of today's video. First, I'm going to define vibe coding. Then we're going to be talking about the principles of good vibe coding. I'll then show you some examples of vibe coding in action using Replet Windsurf. Then finally, I'll end with some very practical tips to help you along your vibe coding journey and to make sure that you don't end up as one of these people from X and Reddit who really up. I do not want that for you. So, please pay attention until the end. Let's now define vibe coding. I'm sure many of you have heard the term vibe coding a lot of times by now. And this is a term that was coined by Andre Kaparthy who among many of his achievements is one of the founding members of OpenAI. On February 3rd, 2025, he made a post on X that says, "There's a new kind of coding I call vibe coding where you fully give into the vibes. Embrace exponentials and forget that the code even exists." It's possible because the LMS's, for example, Cursor Composer with Sonnet are getting too good. You basically just tell the LM what it is that you want to build and it would just go ahead and build it for you and some people literally just speak to it like talk to it. Also, I just talked to Composer with super whispers. I barely even touched the keyboard. For example, you can just prompt it with something like create a simple React web app called Daily Vibes. Users can select a mood from a list of emojis. Optionally, write a short note and submit it. Below, show a list of past mood entries with the date and a note. And yeah, that's it. Give it to the LM and it generates the code for you. And voila, that's what you get. Seems very, very simple. Crazy, right? You can see how it fundamentally changes the way that you code and and build things. But with that being said though, it's not like black magic and vibe coding will magically just work for everything. There are still principles and order in this chaos in how it is you ask it to build these things. So without further ado, let's actually cover these principles. The best course that I found that covers the principles, the fundamentals of vibe coding is a course called Vibe Coding 101 with Replet. It's a nice little free course that's created by Replet, which is a platform for vibe coding apps in collaboration with deep learning AI. The course explains that there are five fundamental skills in vibe coding, which are thinking, frameworks, checkpoints, debugging, and context. You need to thoroughly think through exactly what it is that you want to build and then communicate that with the AI. What we mean by think thoroughly is actually four different levels of thinking. Say, for example, you want to program a computer to play competitive chess. The first two levels of thinking are probably really obvious and it's just like very intuitive to you. Logical thinking is just what is the game and in this case the game is chess. The next level analytical thinking is asking the question how do I play this game? What is the main objective the goal of the game? Now the third level is computational thinking. You need to figure out how to fit the logic of this game into a complicated set of problems and configurations on the chessboard. You also need to think about how do you enforce these rules. And finally at the top level of thinking is procedural thinking. This is when you ask the question how do I excel in this game? Not only do you want to play this game, you want to play it well. So, you need to think about what are some strategies that you can use. What are the boundaries that you can push so that you're able to program your computer to be able to do well at the game. Then, of course, you need to translate this natural language that we described and communicate that to the AI to build. Now, for whatever it is that you're trying to build, a game, a web app, whatever, you also need to go through these four levels of thinking to truly properly define what it is that you want to build. Honestly, this is where most vibe coders have the most opportunity for improvement. Because oftent times because you're using natural language just to describe what you want to do, you don't really actually think through what it is that you want to build, what it is that you want your final product to look like. And that's actually kind of unfair because if you don't even think through exactly what it is that you want, how do you expect the AI to be able to figure out what it is that you want built? And actually, the best way to make sure that you go through each of these levels of thinking and communicate it clearly to the AI is to create something called a PRD, which is a product requirements document. This is an actual PRD that we defined with one of our clients. It is an AI powered personalized nutrition plan for diabetes. Level one of thinking which is logical thinking defining what it is that we want to build. So this is as part of the project overview. We wrote that the goal of this project is to develop an AI powered system that creates personalized nutrition plans for individuals with diabetes. The system will take into account various health related factors such as medical analyses, weight, dietary habits, calorie consumption and more. The next level of thinking, the analytical thinking is encompassed by the skills section. So this is where you list out what it is that you need in order to build the thing that you want to build. In this case, we wrote Python, healthcare data processing, open AIS API, image processing for visual plans, and UI development. You can you can also go into more detail about this if you want if you're very if you're more particular about which specific packages you want to use, which kind of front end, which kind of backend that you want to use, but this is good enough to start. For computational thinking, I like to express this by having a key features section in the PRD. This is where we can clearly define and have a plan based upon what we want to show up in the application. Here we have it divided into milestone one and milestone 2. The first one is a generalized personalized nutrition plan engine that includes specific metrics like individual health metrics and socioeconomic factors. The level two is where we want to give more contextual customization specifically considering people's literacy and education levels and making the application adaptable um and more accessible to different types of people for example people with lower literacy. Now for procedural thinking the highest level of thinking thinking about how do we make this application the best that it can be this is exemplified throughout the PRD just by adding as much detail as possible. For example, defining exactly which factors like individual health metrics like medical analyses and dietary intake data and socioeconomic factors such as income location and local food availability as well as what types of contextual customization. But the best way to think about it is the more detail you can go into thinking about your target audience, who you want to be using your application and that experience that they should get and all the factors that go into it to make it the best experience possible. the clearer your vision is and the clearer the PRD is and the better results you will get from the AI. Also, just by the way, you don't need to come up with this PRD all by yourself. Um, I'm actually going to put like a prompt on screen right now. Feel free to take a screenshot of this. This prompt will work with you and ask you the right questions for you to be able to come up with a well-defined PRD to build your app. I highly recommend that you spend a significant amount of time at this section. It is always so much easier to have a clearer vision of what you want as opposed to build something, figure out that it's not exactly what you want, and then try to fix it halfway. The next principle of vibe coding is to know your frameworks, whatever it is that you want to build, chances are somebody has already built something like it or something very, very similar to what it is that you're trying to accomplish. And since AI is trained on all the pre-existing solutions that are already available, if you're able to direct the AI towards the correct framework for building what you want to build, you're going to have much better results than asking it to just try its best to come up with something from scratch. And the easiest way to do this in vibe coding is just to list out the frameworks or the packages that you want the AI to use to implement the solution that you want. You're kind of just like pointing it in the right direction. For example, for your web app, you can specify that you wanted to use a React backend and a CSS and HTML JavaScript front end and specifically maybe Tailwind CSS for the styling for this specific type of application. Or say that you want to be creating animations, you can specifically say please use 3.js which is a very popular package for creating animations. Okay, so the question you might be thinking right now is like Tina, but what if I don't know what is the best way of implementing this thing? No problem. You can actually ask AI to help you figure it out first. For example, if you want to implement a drag and drop UI, which is a very common thing to implement, you could say, could you help me come up with some React frameworks to implement drag and drop into this application and then implement it. What is actually the key thing here is to be open to learning about these different frameworks and how all of these components fit together. With vibe coding, it's not necessary for you to exactly know how to implement each of these things yourself, but it's still really important to have an understanding of the structure of what it is that you're trying to build. Like if you're making a web application, at the very minimum, you should be aware of what a front end is, what a backend is, how the front end and backend communicate with each other, and what are certain frameworks that are very popular or commonly used for the front end and the back end. Think about it as building and developing and learning with the AI at the same time. This will make you a much better vibe coder in the long run. The next principle of vibe coding is to always have checkpoints and version control. Things will break. That is a fact. You do not want to end up like this guy, for example, who lost all of his work because he did not know about version control. It is a cautionary tale. He posted on X, "Today was the worst day ever. The project I had been working on for the last 2 weeks got corrupted and everything was lost. Just like that, my SAS was gone. Two weeks of hard work completely ruined. But I mean he is trying to stay positive here. He started from scratch. Blah blah blah. He's going to rebuild everything from cursor. So you know at least he's remaining positive. But anyways the point being that please always have version control. There are some software like replet for example that has pretty decent version control that's already built in. But for the majority of software and it's just like generally best practice is to learn how to use git and github which I'm actually going to give you a crash course on right now. If you already know how to use git and github consider this a quick little refresh. So first of all git is the version control software itself. While GitHub is a website that allows you to store your code, your repositories on the cloud so that you're able to have it, you know, saved somewhere else and also so that you can share it with other people. So, first you need to install git and you can do this by either downloading it from the website or you can go through your terminal/comand line or honestly you can just ask your AI code editor software whether that be like replic whatever and just directly say like please download git for me. Now assuming that you want to start a new project from scratch and you're in that current folder the command that you want to use is get init which is initializing git. Now let's say you start adding some things you might want to add a readme where you know you just start like vibe coding and now you have a bunch of files that are there. And if you use this command get status it will show that you have a lot of files that are unttracked. So in order to track these files you use the command git add. You can do get add like readme.md or whatever files that you want to start tracking. Or you can just do get add with a dot. The dot means just track everything. But you're not done with just adding these files and tracking these files. When you actually want to save a certain version of it, you use the command git commit. This is where you would explicitly commit the changes that you made to the files. And you can also type a message that explains what you changed in the codebase or otherwise known as the repository. For example, your first commit could be git commit-m with initial commit as the comment. And that's it. Actually, if you just do this, you would be tracking your changes, saving your changes by committing it. And you just keep on doing that. And if you ever want to look at the changes that you made, you can use a command called get log. And if you want to roll back a commit, then it's git reset. Okay. So after you made a bunch of changes, did all your things, and maybe you want to share your code now on GitHub. You can go to github.com, create a new repository, and initiate it. Copy the remote URL, then use the command get remote at origin, and then the URL. This will link your local repo that's being saved on your computer to GitHub. Then you might want to rename your branch, which is the current repository version that you're working with and call it main. So you can do git branch- m main. Then finally, you can push everything from your local repository onto GitHub with the command git push- origin main. There are obviously like a lot of other little nuances and commands and like things like that um specifics that you can go into a lot more detail about, but just knowing what I explained to you that entire workflow, that should be enough for you to have a good understanding of what version control is supposed to look like and what the flow is supposed to look like. And even though I did cover the exact commands that you should be inputting using an AI code editor, you actually don't need to know these exact commands. Like as long as you know what that structure is, you can just directly ask the AI using natural language. like you can just say um use git to commit these changes, push it to GitHub on this branch, roll back the previous version, merge everything together. I hope that makes sense. Overall, I hope you can also see that the key to vibe coding is to understand these like highle structures, these highle components and the flows of things so that you're able to direct the AI in the implementation. Implementation is where AI excels at. The next important skill of vibe coding is debugging. Whatever it is that you're building is going to go wrong. It's just a matter of when it's going to go wrong and how it's going to go wrong. Which is why debugging and fixing the thing is just as important as the actual building itself. This is a skill that is drilled into engineers with many many years of training. But for many vibe coders though, especially those who don't have an engineering or coding background, debugging might be something that they don't actually have a lot of experience in. And it's very important to learn this skill. The best type of debugging is very methodical and thorough. First, you need to identify where the problem is and what the problem is. then you need to apply different solutions to try to fix the problem. Sounds super simple, right? But do not underestimate the art of debugging. In the case of vibe coding, when you realize that something doesn't work, um I actually find that the best way is to just point it out to the AI and then let the AI come up with the solutions to fix it itself. For example, I recently did this live stream where I was building this application and then it kept on coming up with an error. I basically just copy pasted the error message and went like there is an error and the AI responded with like oh let me try to fix it. and then it comes up with like different solutions to try to fix the problem. And really all you have to do often times is just to accept the changes and if it still doesn't work it might just go through like a lot of cycles of this. Just got to be patient and just you know keep pointing it out letting it do its thing and often times it resolves itself but in the off chance that it doesn't resolve itself easily. It is really really helpful to have a basic understanding of what you're building. Like for example, I kept on getting the same error over and over again. But since I understand file structures and how the files are working with each other, I was able to point out which file was probably causing the problem and which section was probably causing the problem and the AI was able to go and fix it. Another example was when I got this overlapping UI component which I didn't like. I was like this thing is overlapping. I sent it to the AI and then it like made some weird changes and the whole thing just disappeared. And then I was very patient and was more specific about exactly what it is that I wanted. And looking at the code, I could tell that it was just statically trying to input like a certain dimension so that depending on the orientation of the website, sometimes it would overlap and sometimes it wouldn't. And then I just pointed out that I needed to be dynamic so that it's not overlapping at any point. And then fortunately, it was then able to fix it. And finally, the last principle of vibe coding is to provide context. The general rule of thumb is that the more context, as in the more information and detail that you can provide to your AI, to your LM, the better the results are going to be. And context can come in a lot of different forms. It could be that the original prompt or the PRD that you're inputting has a lot of details in it. You can even provide it with like mockups of what exactly you want it to look like. Or you can be providing it with examples or extra data that can help it build the application. Details about your app, your environment, your preferences, as well as errors. Instead of just saying this thing doesn't work, you can actually copy paste the full error message and a screenshot of what exactly doesn't work and provide that to the AI. Okay, so here's a little pneummonic that can help you potentially remember these principles of vibe coding better. The friendly cat dances constantly thinking frameworks, checkpoints, debugging, and context, which immediately comes in handy for you now because here's also your little assessment, which I'm going to put on screen right now. Please answer these questions and put them in the comments to make sure that you're following along with the things I am talking about. I'm now going to show you some examples of vibe coding starting with Replet. Replet is a platform where you can use AI to vibe code different applications and deploy them really really quickly all on the cloud. It is super beginner friendly. All you have to do is log on to Replet and they have some free credits that you can get started with. Let's start off with the PRD for a very simple app that displays SEO metatags for any website that is inputed. Okay, so to get started, the first thing I'm going to do is actually use chatgbt to help me really think about what I want this application to look like and generate a PRD for it. And I'm going to use this prompt over here, which is a variation of the prompt that I showed you guys earlier. And I'll also link an example PRD for chatt. So it just says, help me to make a PRD for an MVP app. I'm looking to vibe code. So, an interactive app that displays the SEO metatags for any website in an interactive visual way to check that they're properly implemented. The app should fetch the HTML for a site, then provide feedback and SEO tags in accordance with best practices for SEO optimization. The app should give Google and social media previews. And then thinking through these questions, what is this app? How do I use the app? What are the patterns behind the app? And how do I make the app the most useful for the target audience? And including a PRD example here. And it helps us generate this. So, SEO tag, visual inspector, MVP, PRD, project overview, and it shows all of the key features that are here. So, input URL field, HTML fetching and parsing, SEO tag extraction, and visual feedback previews. And there's also a nice to have section. All of this looks pretty good. I do want to have a key feature of actually displaying the total score out of 100. I also do want to get rid of these nice to have haves over here cuz it's always best to start off with the very very key features and then add on to that. So I'm going to ask it to refine it with for key features. Could you include a total score out of 100? Also remove nice to haves. Great. So visual feedback is over here. Awesome. So this looks pretty good to me. So, I'm going to write is could you make this into a prompt uh to build an app using replet? So, that's what we're going to use. Great. Wonderful. And on top of this, I'm going to say generate a image mockup or inspo. I'm going to download this. Here is a replet. And what I'm going to do is just copy paste the prompt from chatbt and also link the inspo and click start building. All right, it's going to be called SEO Tag Scout and it's asking me if I want these like additional things that are here and I'm just going to say no because we can add these additional features later. So, we can approve and get started. As it's generating, you can see that it's literally designing the visuals and it's also populating the files over here as well. So, for Replet, it already does have pretty good um version control. You can roll back pretty easily here. Although for best practices, you still really do want to be using Git at some point. While it's finishing up building everything over here, what I really recommend that you do is you can go over here and actually add an assistant and use the assistant and ask, could you explain to me the file structure in this project? You don't have to do this, but it's one of those things where if you're learning about the frameworks that are being used while you're vibe coding, this is going to significantly improve your skills as a vibe coder because you're going to be able to understand what's actually happening and how the files are going to be interacting with each other. We can see over here on the client side under client, you have the main React application code in the source. So, client source and you can see where the UI components are as well. And on the server side, it tells you where the main service entry points are like index.ts. And here's the code for that. And then roots and things like that as well. Just understanding the files over here and how they're interacting with each other to produce this completed app is already going to give you a huge leg up. And if you really want to dig into like some of the actual code, you can always rightclick over here and then you can say like explain with assistant for example. This is very very optional, but it is a really really great way for you to learn um what the code is actually doing if you're interested. All right, it looks like our app is now finished. Let's actually test this out. So, let's try ww.lonely octopus.com. Check. Uhoh, that didn't work. So, what I'm going to do is there is an error like a true vibe coder. We're going to hope that it fixes itself. Okay, let's try testing it out again. Lonely octopus.com. And cool, it seems to be showing something. the title, shorter than recommended, meta description, blah blah blah, all of these things. And we can see that here's the Google preview, here's the social media preview, Twitter card previews, and raw data tags. Okay, so I just want to make sure that the like number actually changes depending on the website. So let's try something else like the website called the useless website.com. Okay, so it's also still showing 86. What about this other website? Okay. All right. So the number is changing depending on what it is. It's like this is not visually appealing. Make it colorful. Yeah, make it colorful. I also don't like how the raw data tags are here, but it's not specifically specifying like what the title is sort of the recommend like what is the actual title. Like I want that to be showcased and I'm going to do that in the next round of edits here. Another key thing to remember is that it's best to when you're pointing something out, like something that you want to be changed, doing it one at a time as opposed to like a laundry list of things that you want to change cuz that could potentially confuse the AI. Oh, cool. I guess it did that already without me saying anything. Oh, and it's like showing little icons. So, that's nice. Okay, let's try this again. lonely octopus.com. Okay, I like that. This is much much better. Another thing that you can do over here is that you can actually click here and then there is a dev URL that you can directly look at from other devices as well. So all you have to do is scan the QR code. So you can actually see what it's like on other devices too. So if I were to type lonely octopus.com, you can see what that experience looks like on mobile as well. So this is a example of what it would look like to be web coding using Replet. And once you're done, you can take this and deploy it when you want to. But if you do want to create something that is more complex and that's also more scalable, you will at some point want to migrate to a AI code editor, something like Windsor for cursor. So I'm actually just going to show you what that is like um using Windinserve for example. First of all, regardless of which of these tools that you're using, the principles that we just talked about for vibe coding, like the skill set itself is pretty much the same. So don't worry about that. It's more the fact that after you get through the beginner stages, most people will want to switch over to AI coding editor like cursor and windsurf because it's more robust, has more functionalities, and also allows for greater scalability. Of course, with these types of things, there's always a trade-off. Like with Replet, it is a lot faster, really easy to use. Everything is based on the cloud. So, you don't really have to deal with setting up your environment and the deployment process. While for cursor and windsurf, there are a lot more functionalities that are available. These code editors are built for like full scale development. So you're pretty much able to do any type of development and be able to tweak things and fine-tune things to the exact way that you want it to look. Of course, the downside is that there is a higher learning curve. You need to learn how to set up your environments properly, how to debug issues with your environment. A lot of issues come because of not setting up your environment correctly. You also need to learn how to deploy things, how to monitor things over time. So this is the wind surf environment and over here is cascade where you can type in what you want the app to build. In this case we're using cloud 3.7 sonnet as the model. So I'm actually going to put in the exact same prompt and then also the image as well on winds. This is going to be a local development environment. So it's going to start off by setting up a bunch of things locally. You can see that the files are populating themselves over here as well. All right. So this is running a terminal command and we can accept this. It's you can disable and the asking and you can just let it auto run but I have trust issues cuz it's on my local environment instead of like rep play where it's in its like own isolated thing on the web. So I do like want to make sure that I am accepting things and not doing random things to my local environment. So I'm just going to click accept to all of these. You can see that it also takes a little bit longer cuz it's setting up all these environments and selling all these packages and stuff. Um, all things that don't need to be done if you're using Replet. Okay, cool. It looks like it has something done. It says, "Feel free to try it on the browser preview I've opened for you." Open the browser preview. I don't see the browser preview. Could you open it for me? Okay. Open preview. Cool. We see that it has some of these very similar elements here. www.lonely Lonely octopus.com for example check. Oops. Need to adding an https. Okay, this actually looks way better than replet's first version. I got to say it actually looks really really similar to the inspo that we provided. It like here's the inspo that we provided and here's the actual thing. It looks really similar, right? Looks pretty good. So SEO tag analysis. Yeah, this looks pretty good to me. Let's try something else. maze.toys/mazes/min/aily. It's just like a random website. Okay. SEO tag is 25. So the numbers are actually different um between Replet and Windfs. So that's interesting. Something I probably want to dig into asking like how it's calculating these SEO tags. But overall it looks like it's working pretty well. And I quite like this. So I'm going to ask it to change though. To improve on this a little bit, I'm going to say edit a screenshot here and be like make it so that you don't need to type https before the URL. Also, copy paste is not enabled. Let's open a preview again. So, try this again. www.lonely octopus.com. We also do need to center this later. And it still doesn't work. So, I'm just going to write still doesn't work. Let's try again. lonely octopus.com. Okay, cool. So, that works now. Um, obviously there's like other things that we want to fiddle around with a little bit like things that are not centered. Might want to change these colors a little bit, but I hope this gives you a good idea for how it is that you can start building using windsurf as the experience. And so, in this case, you also definitely do want to start using git and github as well. So what you can do is be like initiate git for version control and just type that in. Accepting everything here and then git is going to be initialized. Everything here turned green which means that it's unttracked. It asked do you want to get add everything? We can accept get add everything and it's asking us if we want to commit as well as our initial commit. So we can accept we can get commit to. So great now everything is being tracked as version control. And when you're ready, you can also get push and you can actually see everything now on GitHub. But regardless of what you use, remember the principles that we went through for vibe coding. Do keep those in mind and apply them regardless of what kind of tools that you're using. I'm going to put on screen now a little quiz. So please type the answers in the comment section. And now let's go on to our final section where I'm going to give you some more tips and tricks and frameworks and mindsets that will help you along your Vibe coding journey. The first one is very much a mindset. If you're already an engineer, you know, you probably already think this way. But if you're someone who maybe doesn't come from more of a technical background, always think about starting small and working your way up. In other words, whatever it is that you're creating, always think about it as the minimal viable product, which is what are the minimum amount of features that you can put into your application for it to function. After you get the thing to actually work, then you can iterate and put on like additional features and functionalities on top of that. This is the correct vibe coding mindset as opposed to you coming up with like the most lavish, you know, thing with all the details that you can possibly think of and like a million different features. No, no, no, no. I can already think of all the errors and issues that you're going to get from that and then just you like ripping out your hair because you can't figure out what's going wrong. Always start with the minimal viable product and then iterate on top of it. Get the thing to work first. Next up is a framework that's also from the vibe coding 101 course, which I think is really, really helpful. It shows that when you're developing or building an app, when you're vibe coding, there's really only two modes that you're in. You're either implementing a new feature or you're debugging errors. When you're implementing a new feature, what you want to remember is to provide context relevant to the new features. Mention frameworks, provide documentations with explicit details, etc., and then making incremental changes and doing the checkpoints and and version control, etc. And when you're in debugging errors mode, what you want to keep in mind is firstly figuring out how things work. Do you have a good understanding of the structure of your project itself? if you don't, you know, ask AI and and actually figure that out because it's going to be very helpful to figure out what is actually going wrong in your application. And when you figure out what's wrong, think about how to get that information to the LM to get unstuck. And this is where the final principle, context, is helpful. Just try to provide as much context and information as possible to guide your LLM to fix to fix the problem. Give it like screenshots of what's wrong. Give it the error message, point it towards the right file to be looking into. I really love this framework. So take a screenshot or something and whenever you're getting frustrated or not know what you're supposed to do, just try to remember which mode that you're in and what you should be doing in which mode. Final tip that is a little bit more advanced and these are writing rules or documentation. This is kind of like a system prompt that you're giving to your coding agent. And this is where you can list out like certain things that you wanted to do or to not do. For example, some of the best practices that you probably want to put in your rules include limit code changes to the minimum when implementing a new feature or fixing something. This is because AI sometimes has this tendency of like changing a lot of different files um unnecessarily to fix like a very small thing and then it could potentially break other issues. Rate limit all API endpoints. This is just to make sure that you're not like calling an API and incurring like multiple times and incurring a lot of cost. Enable capture on all authors and signup pages. So for security reasons and yeah there are a lot of other rules that you can put into this file. You can also find online like people have written these rules that are specific to like certain types of apps or certain languages that you're using as well that you can put into your rule file as well. And you can take this rule file and give it to replet where cursor ruins surf too. Especially if you're someone who doesn't come from an engineering background or like a development background, I really recommend that you actually look into the rules that are specific for ensuring like safety and security in your apps. Like putting it in your at least like learn things about like API keys and why it is that you shouldn't be exposing your API keys. And while you're learning these, also put your rules into your rules file so you're reminding your AI to be abiding by best security practices as well so you don't get hacked. All right, there is honestly like a lot more that I can go into detail about. Like for example, like having styling documents that you can reference, how you should be refactoring your code, using something like MCP servers. if you're building something like AI agents and you want to give your AI agents like more tools and functionalities. There's just like a lot which I don't have time to cover in this video right now. But please do let me know in the comments if you want me to make a follow-up video where I will go more in detail about exactly how it is that you should be vi coding and giving you more specific advanced examples for AI code editors like windsurf or cursor as well. But for now we have come to the end of this video. I really hope this vibe coding fundamentals video is helpful for you to get started um doing it correctly like vibe coding with best practices in mind. And as promised, here is the final little assessment which do answer these questions and put in the comments to make sure that you retain the information that I just covered. If you're watching this video and interested in vibe coding, chances are you're probably also interested in learning STEM subjects. So, if you are interested in learning STEM subjects, I highly recommend that you check out Brilliant, the sponsor of this portion of the video. Brilliant is a STEM learning platform that helps you get smarter every day with thousands of interactive lessons in math, science, programming, data analysis, and AI. What I love about Brilliant is that it helps you build critical thinking skills and deep understanding of subjects instead of just memorizing things. Brilliant incorporates little quizzes, analogies, and just little dopamine hits that really help a lot when you're getting bored or discouraged. It's shown to be six times more effective than just watching video content. They also have a great mobile app so you can actually dig into a quick little session and learn something new when you have a couple minutes instead of just mindless scrolling. Brilliance programming courses are some of my favorite courses. They help you build a foundation of coding and teaches you how to think like an engineer, a skill that is still crucial in the age of AI and the age of vibe coding. Speaking of which, they also have great AI courses, too, that can help you gain a deep understanding of how AI models work and their applications. Brilliant courses are super high quality and taught by award-winning teams of teachers, researchers, and professionals from Stanford, MIT, Caltech, Microsoft, Google, and more. To try everything that Brilliant has to offer for free, you can visit brilliant.org/tina or just scan the QR code on screen. Or you can also just click the link in the description. If you use my link, you also get a 20% off the annual subscription. Thank you so much, Brilliant, for sponsoring this portion of the video. Now, back to the video. Thank you so much for watching this video and happy vibe coding. I'll see you guys in the next video. We're live stream.