What is Vibe Coding? | Vibe Coding with Catherine and Harshil

to bring to you wife coding with Katherine and Hersel. I'm Hersel and Ied to introduce my colleague Katherine that is over here. Katherine, do you want to go introduce yourself? Yeah. Hi. So, I'm super honored to be here today. I'm super honored that Harshell reached out to me and had this idea to do a vibe coding session. It's something that I've been interested in learning. Um, I joined the developer relations team in August as an event coordinator and I think this is going to be a really cool step into understanding you know I'm doing a lot of hackathons and things like that. So I think this is going to be a really cool step to get a better understanding of vibe coding and I'm really excited that I get to do it with Harshell. Awesome. Uh, thank you again for coming on the stream and being a partner on this series. So for the folks who don't know w what is wipe coding but if you have just heard the term about it don't worry that's what this series is for. We're going to show you and help you understand what is wipe coding and how you can wipe code your own applications. And to take a step a few steps back the idea actually came in because Katherine reached out. She wanted to build an app and I was like, hey, you know what? Let's V code it together on the live stream so that we can also help other people learn how they can do that themselves. So that's the whole idea for the series and today what we are going to focus on is just helping you understand what is W coding and getting you started with like a few tools that I have been using myself. So Katherine, are you excited? I am excited and nervous. That's the same for me. [laughter] But that's a good thing. Uh, and you have to be nervous when you're wipe coding because you never know what the AI is going to generate, which is the fun part of it. Uh, you always have to keep on asking AI to improve the things or make sure it does create what you want to create, right? Uh, all right, Katherine, I know before we, you know, uh, before this, we were talking about your little bit experience of wipe coding. do you want to share uh about that? Yeah, so when I first got this role, I decided something that would be a good idea is to practice live coding in order to do some of my stuff just because, you know, I have a background in acting. That's like a little fun fact. And um something that I I wanted to do was like some method acting. So really see what it's like to like play with some of this stuff. So, I actually used Gemini and I was telling Harsha like it was really frustrating because I spent like two full days trying to tweak teeny tiny little things until it was exactly what I wanted and then it didn't even work the way I wanted it to and it was really frustrating and um it it was a cool experience because I think like I got to a little bit of practice with stuff but definitely did was a big fail. So, I told Harsha already I'm pretty nervous to do this now because I I don't want to fail again. So I'm glad that Harshell is with me this time to be my coach. Awesome. I am excited for this and uh let's talk a bit about like what is exactly WE coding and why it is you know taking a lot of this boom right uh so I'm going to try to take the first uh stab at explaining W coding and Katherine maybe you know if I'm missing out or something or if you want to add something to it please uh feel free to jump in. So for me w coding is mainly asking AI to help you build application and this AI models are now really good at doing that. However there are a lot and lot of things that they are not really good at when it actually comes to coding but they help you get you know like from zero to at least.5 there. So it helps you to like at least create like an MVP or like a minimal idea of your project right. So that's what is w coding for me. What about you Katherine? Yeah, I think like I mean with my one experience with it. Um it definitely gave me what I liked is that it gave me a lot of like ideas. So basically what I ended up doing in the end was it gave me kind of like a blueprint some ideas of what I wanted and I it you know was kind of like giving me cool creative ideas and then what I did is I manually because it didn't work. So I manually took that idea and I created it myself using um Canva and was able to use it that way. So that was kind of cool because it did definitely help me to think differently and give me different inspiration. So that was kind of cool experience as well is that it served that purpose. Awesome. I like that. Uh one thing I have also been doing a lot uh is like you know if I have an idea I just go and ask AI about it before I jump into coding it or like while coding it, right? So what I have been doing is like let's just say I have an idea and I want to build a game. So I would ask AI like hey I want to build a tic-tac-toe game. What are the things that I need? How do I move forward with it? What are the tools that I need to be you know uh like consider what are the edge cases that I need to consider? Because if it's a tic-tac-toe game, there are a lot of like you know winning and losing and even like the drop of probabilities, right? So you want to keep those things in mind. So that's kind of my approach. First ask it for like the edge cases. First try to understand what you really want to build and then take that learning, take that approach and then start you know like working on one feature at a time. Okay. So that is something that I have been trying out and I for me it has worked out decent enough because I get good outputs over here. So something that folks can try out as well and I see we we have someone in the chat saying that they are not a coder but they used AI to make a Python script and a browser extension and this is why I love white coding right it enables everyone to build or bring their ideas to life. You don't have to be a coder anymore. All you need to do is like know how to speak to AI. Well, I'm a good talker. So, [laughter] awesome. Uh, so do you want to talk about what you wanted to build? Uh, and then we can talk about how we are thinking about building it and then we can start probably doing that as well. Yeah. So we use for events we use this program called Luma. Um this is something that we use for registrations for events. Um one thing I mean I think we all can relate to there's these little tasks in our day-to-day lives that are just like oh we always put it off because it's kind of annoying and it's very tedious. So one of these things is just like our registration list. Like we want to be able to invite people who have been to events in that city already. take that list and send them invites to events in the future. Um, and automating that through Luma would be really cool. Um, and it would save us a lot of time with like going through lists, sending the invites, these little tiny tasks that take up so much time um, when we're all super busy. So, that's something that I'm really excited to hopefully um, build into our Luma. And uh for the folks who have never been to a cloudfire event and are curious where you can find it, I have shared a link in the chat for our Luma calendar. So you can always go and check that. There is also another link which is I think meet us dopages.dev. I need to let me quickly try that as well. But you can also go that to that page and find out where we are in the in the world. Cool. Cool. Okay. Uh so the idea over here is to help Katherine with her day-to-day work, automating a bit of it and uh building an app to do that. But before we jump into that, let let's try out like a few simple applications or like one simple application using our own wipe coding platform that's build.cloudfi.dev. So if you hop onto that, we can go ahead and try to do that. So Katherine, do you want to share your screen and maybe we can try building one or two apps just to see how it how the flow is and how we can improve our workflow over here. Yes, absolutely. And while we do that chat, if you have any interesting ideas but simple uh for for today, just let us know in the chat and we'll try to bring it up and try to build that application. Okay, Harshel, you have to remind me what what website am I going to? So, it's build.cloudfair.dev. There it is. Yep, there it is. This is this is CloudFlare's own uh W coding platform. You can come over here build and deploy your application on Cloudflare's global edge network. All you need to have is a account on Cloudflare, which is free to just sign up. So, you can do that. And I see that Katherine is already logged into her account, which is fantastic. So, let's go ahead and try to build an app. So, I'm looking at the chat that is no recommendation yet. So, let's go ahead and try something uh simple and straightforward. Katherine, what what do you want to do? Do you have Do you want to like build something fun? Oh, no. I have no idea. Can you give me a suggestion? I I was thinking, okay, let's do this. So if you see down below there is discover apps built by the community. So we can take some inspirations over there from there or we can go crazy as well. Oh I don't know what these things. [laughter] Okay. Uh if you click on view all I think it would show us the yeah the directory of applications that the community has built. Mhm. The UIs are pretty good. Okay. This kind of I mean it's cool that you have like this um this way to see what other people are doing. I think that's quite cool. Yeah. Exactly. Exactly. And if you want to you can also share uh over here so that people can you know just take that and build on top of it as well which is fantastic. Yeah. It's cool. Not reinventing the wheel right. Exactly. Exactly. Okay. Okay. For some reason, I just got an idea. I don't know. I love that. I love ideas. So, I I I was thinking maybe we try to build Flappy Bird. I don't know if you remember Flappy Bird. Flappy Bird. I don't know what that is. Oh, okay. Flappy Bird is like a really fun and interesting game. You basically have to make sure that the bird is always flying and it does not hit any of those barriers. That's it. Okay, we can try this. So let's let's try to build it and then we can you know see how good it is. Cool. So you click on the plus icon on the top left. Yeah. Y and just let's just say create a create flappy bird for me or something like that. Flappy bird me just like this. And then I hit the little arrow. So what is happening over here is you told AI to build something for you. Now the AI is trying to understand what did you ask for. Next thing it's going to do is it's going to generate as you can see bootstrapping a project. Now in the world of development you basically need a text tech to build an application. So the AI is going to take care of that. It is going to create the or bootstrap the application the basic application which is then uh which is what it's going to use to build the application. Right. Flappy pip. And it is now giving us like a blueprint like this is what the AI thinks the game should look like. Right? So you see it has given a description. It also gave you a color palette. Uh and then it is now starting to write the code for us. Right? Uh I'm trying to see if we can go if you click on the blueprint.md it should uh we should be able to see Where is blue? Where is that? So in the chat itself I don't see when where when it says generating blueprint um in the chat interface. Yeah. Uh I have blueprint this. Yes. Okay. Click it. Yeah. So now we can see what the AI understood from just one single line of prompt that we gave and it has come up with you know everything that is needed. So the game view like how would the game look like? How would the user flow look like right? So if you scroll down uh you can see like the understanding that the AI had and how now it is portraying out over here. And this is really important because this think of it like a guideline for the AI. So we did not give the AI the guideline. The AI generated the guideline for itself. It knows all right this is the color palette that I need to use. So I need to make sure that I am using this particular colors. These are the things that I want to do. So I'm doing this particular things right is generating it. It's already there for you. Wow. Click on tap to flap. Tap to flap. Love a rhyme. Oh wow. Let's do restart. Let's tap to flap. Oh. So as you say right, this is what AI is, right? It does generate the code for us but it is not perfect. So what you can do is now you can go and chat with the AI and tell it what the problem is. Yeah. So we can tell it like hey the game renders which means that we can see the game but renders. Uh but when we start the game it ends immediately. We're just basically describing what is happening but we now need to be more specific. Oh the message. It's okay. No worries. It's like uh [laughter] [gasps] Oh good. Uh so what I would also add over here is I would also say hey the game uh starts but it ends immediately. I'm not able to uh interact with the bird or I cannot even see the bird and stuff like that because it needs just giving it as much context as you can because for now it kind of becomes a bit vague for AI right so whenever you talk to AI you have to be as much you think of it like providing it as much information as you can well I still doing stuff so I can't tell it to do stuff until it's done doing what I already asked. Yeah, it's okay. It's okay. But we we got a good start. We got a good start. In like one shot, we had the UI. We had like nice looking animation for the game and we had like a start and the restart button working as well. So I said this is like a really good start for us. So you know something like a question I can ask while we're waiting on this is you know I am coming from like a marketing perspective. So, if let's say I mean know this is a game, but let's say I'm creating something that I want to use for for marketing. I could change the colors to be like our brand colors. I could change like the font to be like our brand font and stuff. Yep. Yeah. Yeah. So, if you want to do Exactly. So, if you want to do that, what you can do is once it generates this, you can be more specific or in the previous uh prompt itself when we said create a flappy bird game for me. In there itself I would be specific like this is the color font. Exactly. This is the color scheme that I want. This is the font style that it should be using. Whatever like whatever things you want it over there. All right. Now it says anything was fixed now or should I just So uh I would say let's take a look at what it responded in the text first to understand if it actually resolved it or not. Right. So okay so it says it's trying to you know understand the trying to figure out what the problem is. It did that and it says like so there is a problem in a function that is called game loop which is basically like creating a loop for this game. Okay. So again if you have any questions over here I can have I'm happy to do that. One thing I always do is also check the code. But over here, not everyone over here is like a coder. So I don't want to like make it a bit intimidating. So just skip that. But we can always chat and try to understand what is happening over here. Right? So it gives us a good breakdown of what the problem was and how I tried to resolve it. So if you click on restart, let's try it again. Okay, one thing. Let's let's refresh this. So if you see like where it is like Yeah. Yeah. Let's refresh this and let's try it again. Okay. So let's do this. Now I'm going to go and say, hey, can you check the game logic? It does not It looks like it is not working correctly. Make sure that the game logic is in there because we are still facing the same problem. It looks like it's not working correctly. One more time. What do I say now? Sorry. Uh it looks like it is not working correctly. Uh we are still facing the problem we faced earlier. I like to say thank you. So I I I do that. I do say please and thank you but someone made me realize that you kind of are wasting tokens for this tokens. Can you explain what a token is? Okay. Uh so tokens basically under the hood this AI is nothing but all mathematics right and uh when you send a message it compiles or breaks it down into mathematics and it understands that to okay I'm going to take a step back and like just forget what I said about mathematics. So every time you send a message one character or each character that you send to AI is kind of a token. Ah, so I So you want to make sure Yeah. So you want to make sure you're just sending the uh character which is going to be useful to it. Okay. So no high like no none of this polite things that we're trying to use with other humans. Yeah. Yeah. Which is I I I I mean I don't have any strong opinions but that is what you know someone like made me realize that you are just wasting tokens which made sense to me. I'm like it's an interesting perspective. Yeah. Exactly. Exactly. So yeah, again like it's there's no harm in saying thank you and please. It's it's there's no harm in being kind, right? So it's always good to be kind. That's my motto. [laughter] Okay. So it's still debugging. Deep debugging. Okay. I I see a couple of people in the chat already and they are they are sending us some useful thing. Uh handle input tab jump update physics. Okay, someone has tried is is I someone has like given us a good output of what might the problem be. But let's see what AI is trying to do over All right, just the task is complete. I will verify everything is working correctly and check for any other issues. Okay. Uh let's click on tap to flap. And do I need to refresh before? I think it did refresh for us, but we can do it again if you want. Okay. Let's let's tap to flap. Nope. This was like a similar experience to my last time, not going to lie. Okay. Uh [laughter] but that's that's basically what V coding is. try have to try try to break things out and figure out what's going on. Okay. Uh so the game is loading, things look fine. What we want to do is ask it to break it down. So let us say uh can you check the game start logic and help me understand what is going on? Yeah. I said no thank you this time. Not wasting any tokens. All right. So, it says the game starts. When you when you press the space bar, the up arrow key or by clicking your mouse button. That's cool. When you do this, the game state transitions from ready to playing and the game loop begins. All right. Does this make sense to you? No. Either pressing the space bar. So if I press space bar Oh, you will have to click on that screen. I think I am. Let's try it. Okay. Maybe like refresh it. So now I hit the space bar. Oh no. Okay. Okay. Okay. So the space bar is like doing the refresh thing. So let's click on the game again. So click the the little play button. Okay. Now, if you do space bar, would it work? No. No. Okay. Okay. So, the space bar thing is not working. Uh, I like how everyone in the chat is also invested in this. They're helping us. I love invested. [laughter] Uh, someone says a step-by-step process. Exactly. It's a step-by-step process. That's what we going to try to do. Uh, there's also a suggestion that can you keep pressing the mouse button. I like that idea. Okay. So what they are suggesting is when you click on restart the game just click keep on clicking the mouse button like on re like like like with tempo or hold down with tempo with tempo. Oh okay. Oh that was like something different was happening though right? Yeah. Yeah. You do it again. This is what let's don't do the tempo. Let's just keep when you click on restart, just uh hold keep on clicking on it. Yeah, just Yeah, click and hold. Exactly. Oh, just do restart first and then click and hold. Okay, got it. I'm click and hold and Oh, no. Bummer. Yeah. Yeah. Someone is suggesting to check the code, but I I I want to be like a full white coder who does not know how to code. That's what I'm trying to do over here. Okay. Uh so this suggestion was still useful, right? Because we were moving a bit forward. This clicking thing, this like this we were seeing different stuff. See this little this green bar is that was Yeah. Yeah. Yeah. Yeah. Okay. So, let's do this. So, we know things are sort of working. Let's try and ask AI how do we exactly play the game is yeah the tempo was working. I think so too. But then so for some reason it feels it wasn't it was like so when I was doing the tempo thing like the tempo um the green bars were moving. There was no like bird flying. So the yellow thing that you saw was that the bird? I think so. Yeah. Oh no. They need to improve that bird. I will say [laughter] that looked like a that looked like a snitch from Harry Potter. Okay. So, to play, this is how you to play Flappy Pip, you need to make Pit flap its wings to keep in the air and navigate through the pipes. You can make Pit flap by pressing the space bar, pressing Maybe I need to try this up arrow key and clicking your mouse. Oh, there's a lot of things at once. I'm not a gamer. Oh, no, no, no. I think it's just one of them. Okay. Okay. I'm not a gamer. [laughter] Okay. Uh, do you want to like check if you want to like keep and keep holding it or do you want to like do it in a tempo? What do you recommend? I would say just let's just ask AI like should we keep on pressing the key or keep should we press the space bar on repeat or press and hold it down? on repeat for each flat key you want. So, like the tempo thing was correct. Exactly. That's why we saw a little movement. Okay. Let's try Let's Let's do another try. Do a restart. Yeah. Do you want to maybe use the arrow key? Yeah, I'm going to try it. Oh, no. Oh, that didn't work at all. Where did it work? You moved like Yeah. But I I think what Okay. I I also now Okay. I also think I know what the problem might be over here. I am assuming it. I might be wrong. But what I'm thinking is expert. I am. So what is happening is it is uh hitting the pipe way before it is like you know the pipe is there right? So Oh like the bird. Yeah. Yeah. Yeah. So, so for like the game, it's like it for some reason thinks that the it has already hit the pipe while the pipe is still far away. That's my that's my kind of logic over here because the keys are working. A bird is moving forward. So, we know that that's fine. But I think now the problem is with it detecting where exactly, you know, the problem is. All right. Okay. Uh so we're going to do this. We're going to try it one more time because the idea was not to to build this. The original idea is to help build something that is useful for you. So uh what we're going to do is we're going to try do this one more time and then when we going to switch gears uh and like start talking about what exactly you wanted to build, what tools we are going to use, how we going to configure them and move forward from there. Sounds like a plan. So, I hit restart again and space bar or arrow. What I would say, let's let's give AI one more chance to fix this. Okay. So, what do I what should I let him know? Uh, so I'm thinking over here um or her that uh can you check uh the collision logic because it's like colliding with the pipes. Sorry. Podation. A collision. Can you check the collision logic? the it looks like the bird hits the pipe way before uh or way early or something like that. Just trying to form a sentence, but I cannot for some reason. Sometimes it's hard on the spot. Um and ex and especially when you're when you're doing a live stream and people are watching. Oh, for sure. There's a lot of nerves involved. Well, what so I'm going to uh talk about what we are doing now. So we had like the game created in one go, right? We started facing some problems. So we are now breaking down those problems in like simple steps that we understand and we are asking AI to like hey can you check this for me? Can you help me understand what is happening over here? Right? So we are not just telling AI to fix everything all at once because again with AI it might fail often that you know it it does try to solve one problem but when it comes to the second problem it tries when it tries to solve the second problem it introduces another third problem in there that is happen that happens a lot. So make sure you do this step by step you recognize the problem try to understand that problem and try to fix that before we jump onto the next one. Right? So that's what we did. That's what we're trying to do over here now. It's loading. All right, let's try this. Let's cross our fingers. It's going to work this time. Positive energy. So tap to flap. And then I'm going to do the space bar or the arrow. Whatever. Whatever works for you. All righty. I'm going to do space bar. FYI. Oh, this is already it looked a little better, but then it did stop, right? It looks like the AI is still working on it. If you see something happening on that in this little What is this called? Was it chat? In the chat. Oh, while this is happening, I think it happened. It's done. Yeah. So, restart. Try again. Okay, you guys. Let's all bring our positive energy. Oh. No, that was okay. Let's refresh the pages once again. Yeah, they really we if we got to the level, we would have to edit the bird image. Okay, ready? Yes, this is it, you guys. This is the one. But we we we getting there. That's good. That's good. And while you were playing, I had an idea, you know. I love when you have an idea. You could have instead of Flappy Bird, this could be like, you know, like having a a bot or a virus trying to attack your application and we have Cloudfire clouds trying to defend it. Something along that lines. [laughter] I like the That would be so on brand. Yeah, I like the marketing strategy there. All right. Uh uh cool. Okay. So, as I promised, we gave it a shot. uh what I want to do is not like you know do the same thing again and again. I want to show few other things for the folks who are over here joining us and viewing this. So as you can see there is a button that says deploy, right? Which means that you can just click uh not that one. Yeah, this one. Exactly. There's two deploy buttons. Yeah, I'm going to talk about the other one in a minute, but let's click on this deploy button. What this is going to do is this is going to deploy this application for you. So you can then share the link with your friends, with your family, and they can also play this game. So you basically build a game. That doesn't work. But that does work. It It's more challenging. They just need to figure out the collision in there. Okay. So I It's deploy. Is it deployed? I Yeah, it is. Uh it should show you show us where it's deployed. Okay. Let's let's try to click on deploy again, but we should get a message. Now there's a now there's a a no sign. But I guess cuz it's already in process. Oh. Oh, I think I know what the problem would be over here because we haven't connected it. Uh, we haven't connected it with uh with your CloudFare account because you logged in with your Google account, right? Uh yes, my but my cloudflare Google is that not good? Uh no, we have to connect it with the Cloudflare account. That's fine. Uh we we can do this probably in the next one. uh just like the deploy part because I want to talk there is a lot to talk about and I'm excited when it comes to this. Sorry. Uh I'm just nerding out. Uh but yeah, now you talked about like the first deploy button, right? Uh this one which says deploy and then fork fork. So the cloudfare team they built this uh w coding platform and they open sourced it which means that anyone who wants to build their own w coding platform can just build and deploy it on their cloudare account. So they can have the same thing on their own domain and if they want they can add payment gateways, they can you know change the underlying uh AI model that is being used. They can change the logo. They can like customize it the way they want and basically just have their own W coding platform. So that's something interesting. So folks, if you want to like if you were thinking about building your own white coding platform, which is hot right now, you can just fork this, deploy it on your own toughare account and you have your own white coding platform. All right. Uh so this is basically how a lot of people do wipe coding. It's like you know where they have where they go into white coding platform uh and then just ask the AI to build something like this. Over here we did it uh we build a game you can do a more useful application that's fine. Now if you think about an application which Katherine you really want to use which is like an automation app for yourself. We want to you know make sure it is one secure because over here we are going to deal with people's email address and I am very privacy concerned person. I don't want AI to have access to the email uh addresses of anyone. So I would in that scenario what I would do is try to build things on my local machine but still wipe code it. Okay. And there are tools and ways to do that. One of that we are going to see today is called windsurf. So windsurf is a code editor. Now if folks don't know what a code editor is, think of it like uh how do you call it? Uh Microsoft Docs or like Google Docs but for code, right? So you basically go in there, you write the code and it gives you a lot of good utility functions out of the box or a lot of good uh formatting structure which you would want to have in a code editor because if you just write code in like Google Docs, it makes it really difficult to read and you can also not run that code using uh in if you're like writing it in Google Docs, right? So you need a platform where you can write code more efficiently or in a better with a better experience and you can run as well. So Katherine yes earlier we did install windf on your machine. Should I open it? Let's open that. Let's show people what winds looks like. Here it is. Here is Windsor. As you can see it's like a completely blank window. There's no project over here. There's nothing that we can do over here. But there's think of it like a similar experience that we saw earlier but locally. So there is on the right hand side something called cascade code. Yep. Exactly. So this is this is where you would basically interact with the AI. And winds has I think two different modes. One is the code and the other one is a chat. And so we want to use chat. I don't speak code. I speak German and English, but not code. I love that. I love that yet. So, uh, okay. Where I was? Sorry. Okay, that that was a good joke and it kind of distracted me. Sorry. [laughter] Okay. Uh so uh in here when I say about the code mode it's basically windsurf just writing the code for us and we pilot or we you know like give instructions to winf and it writes the code for us okay while the chat interface it's more like you know like asking questions and getting more answers for that getting more understanding of the code right so so it's different so it's different than like what we were just doing before when the chat was actually actioning things for us yeah yeah yeah So over here the chat is just chat. It's not going to write anything. It's just like a chat bot that's giving you advice but it's not changing Exactly. While the code mode is what we did earlier. Yeah. Got it. Okay. So uh we we don't have a lot of time. So we would be what we would be doing is we would just you know like take a explore windshield a bit right try out like the chat mode and probably the code more. And I want to also show one more thing which is going to be really useful for folks who are wipe coding and want to deploy on cloudflare right. So the first thing as we see over here on the right hand side is the is cascade right and this is where you can like basically interact with this. Now just below the text box you see there is code written. So if you click on it sorry where yeah yep I click on you click on it. Mhm. It says now you see that that option you can switch between chat and code. So let's go to chat. We can do chat over here. And there is also an option to change the model. So if you click on GPT 5.1 you can see all the models that you can use uh with this like and how do you know which one you want to use for like how is it just a taste thing? Is there like certain things that are better for different activities? I like that question. So uh the the interesting thing is that these models keep on you know like improving every day. So the one thing is you kind of want to like keep check of which is like a good uh AI coding model. Uh the other way is like try to you know use few of those prominent models and see which one works best for you. So far I have been using uh claude. So there's cloud shown at 4.5. Yeah, that's the model that I have been using. okay. Uh so thinking basically is going to like let AI think a little bit first. It you know like proposes a solution. So that's what the thinking is. It's going to like say hey let me take a step back. Let me try to understand the problem. Let me try to find more resources for this and then write the code for you. Right? So that's what basically thinking does. we can just go with cloud sonet 4.5 in my experience it has always worked well the GPD your experience the GPD 5.1 model that we had earlier so if you open that is like GPD 5.1 yeah so this is like the latest model from openai I think they announced it yesterday oh wow so it is like fresh off the press fresh off the press exactly so we can play around with that as well so any model we you want to try we can do that uh but what we want to do is just yeah let's just go with GBD 5.1 and let's just ask uh it let's just you know try to build a plan for our application so give it a description of what you want to build and ask it what or maybe just how we can build it just you know do that let's do that what do we want to say we want to build uh the automation app that you want oh okay I want to build an app that pulls attendee list from past events that took place in the I want to say like same city and automatically invites them two events taking place in the same city. Does that make sense or should I reward This for me it makes sense but I would also give more information now like what platform you're using because we are using Luma. Yeah. So a high list in the platform Luma. All right. Now one more thing because we are going to build and deploy it on Cloudfare. We want to also specify that so that it looks into our products looks into like what Cloudfare has to offer and what we we can use for this project. Use Cloudflare. I took out please no tokens. Um use cloudflare to build and deploy. Anything missing? So there is nothing missing over here. Now if we if we you know just ask this question what it will happen is AI is going to like try to answer it based of the information it has while it was trained. Right now I don't really know when GPT 5.1 was trained but at Cloudfare as you know we ship new features new products almost every week. So AI would not have that information. So how do we give AI that information is one of the challenges that I think the industry is trying to understand now and the solution for that is giving it access to our documentations MCP show. Okay. Mhm. So, uh, if you go back to Chrome, I'm going to ask you to like do few more steps. Oh, here's Chrome. Yeah. And if you go to developers.cloudfair.com. Yeah. Uh, can do that. And just on this in the featured uh section you see there is AI tools. Mhm. Click. You can Yep. You can click on that and you can see how we are trying to make it easy for you know people who want to use Cloudflare and who want to wipe code applications to for this that is llm.txt. So let's just say you just want to have one particular product that you know you want to use and you are letting and you want to provide the information of that particular product to AI. we can just copy the llm.txt uh page for that and then send it to AI. This basically is going to give AI the reference to that whole documentation. So I would copy all of this. No, because we don't know what products we want to use. We want AI to have access to our documentation. So if you scroll down again, there is this MCP section. Yeah. So over here MCPS you can add to any of these uh coding uh platforms. M what we want to do is if you just click on wind surf it's going to show you the steps on how you can edit it to wind surf. Now I already know the steps so we can just skip that. Uh if you again go back to our documentation so I go back to win serve. Uh no let's go back to our documentation. We'll have to change the tab I think. How do I go back? Just change the tab. There's only the tab. Yeah. Exactly. Sorry. And if you click on manually. Uhhuh. Yeah. There is a link uh just copy the link. The link copy dogs domcp. Yeah, just copy that. Copy. No, no, no. It's going to copy the whole thing. We don't want the whole thing. Oh, you can just copy that particular link which https domcp.cloudfy.commcp. exactly. I just copy this. And now let's go to windsurf. Back to windsurf. Oh, that's not windfascade itself, there is like this uh plug thing. Yeah, you click on it, it allows you to add MCP servers. So, if you click on MCP marketplace, you can now uh I'm trying to see where is the option to add a new MCP server settings. No, maybe. Yeah, let's click on that. Oh, okay. We can let's copy and paste the whole thing that we had earlier then. Aha, this would be easier. See, you know already stuff. I did correct. Okay. So then we going we want to go to AI tooling again. Let's go to AI tooling our documentation page. Sorry here. Yeah. Just copy that that you did earlier. I just do this copy. Yes. Here. And then paste and then save it. Um where do I save? Just do command S. It should automatically figure that out for you. Yeah. And now you can close that. No, I clo like hit this X button. And there is an error. Okay. So there might be an error because of the configuration. So I'm going to quickly check it on my end what the error would be. Okay. MCP. H okay. It's trying to do HTDI. Ah, okay. I I know what the problem is. All right. So, we don't have something called uh node installed on your computer right now. And that is why we running into this problem. That's fine. Uh but basically, this is the step of how you can add the MCP server in Windsor. And node is something we will be installing uh in the next episode because that is what we want to use as well. So uh we are also almost on time. So uh Katherine can you do a quick recap for me and if you have any questions ask well. Yeah. So today we used um workers Yeah. And that's what we used [laughter] and we um told it basically we were chatting with him with them him her I don't know um we were chatting with the um platform and told it what we wanted it made something was it correct did it work not really but it was a cool experience we got some ideas and um yeah so that's what we did first and then we looked um now at Windsurf chatted with Cascade and told it kind of about we haven't actually messaged it but we now know that we tell it what we kind of want be as specific as possible adding all the details let it know and then it will give us suggestions as to what we should do it won't make any actions but it will give us suggestions as to how we can go about building this automate automized tool for Luma so yeah I'm excited to see where this goes and I want to thank you Harshell for being so patient with me I know that I'm not the most technologically um savvy person but I'm learning and I'm really excited that I get to do this with you Harshaw I mean after this I feel like you already know everything you you really summarized it well you built a game in like what 30 minutes which was fantastic so you are already there it's just you know like me just showing you the right direction I'm not doing anything you are doing everything so you have been doing a fantastic job uh so a couple Couple of quick uh things from my end. So if you want to try out building your own application and deploy it on Cloudflare, you can go to build.cloudflare.dev. That is our own wipe coding platform. You can play around with it. Try to build your own application. You can also have your own wipe coding platform. So if you go to build.cloudf.dev, there is an option to deploy or just go and check out the GitHub repository. So you can do that as well. The last thing is we have all the MCP servers that you should use for your uh with your W coding platform to make sure you are you have all the or you are providing the correct context to your uh AI agents because these agents have been trained with the data which is of the past. They don't have all the recent information. They would hallucinate a lot. So giving them information or the latest information is going to be really useful when you build any uh application with AI tools. So with this uh thank you Katherine for jumping in. I hope it was fun for you and now you're more relaxed and you are like excited for part two because I am excited. It I'm excited. Thanks Harshel for um inviting me to do this with you. Um it's been really fun and I'm excited to finish. Awesome. Uh so in the next one what we are going to do is we're going to now actually start building the application that Katherine wants. We're going to do it step by step. We may hit into issues. We don't know because this is happening with AI. It's really undeterministic. So let's see how that goes and uh let us know what you want to learn more uh from this series and what more we can help you with. Uh thank you so much and see you