Cursor AI Editor Is Overpowered

hi everyone today we're taking a look at cursor a code editor/ IDE as I understand it cursor is a fora VSS code that's just built to be a lot more integrated with AI and language model capabilities we're going to download it try a few things and hopefully by the end of the video we'll know if it's something that me or you could add to our day-to-day and become more productive okay let's go so the first thing we're going to do is go ahead and get it downloaded you'll probably have to create an account because they've recently added that so that people don't abuse it and there's going to be a few steps once you have it installed to sort of set up some settings and things of that sort it's going to ask you to add whatever shortcuts you used in your old editor and I've got the Vim setting sort of enabled you can import uh your extensions from vs code and things like that and you'll then log into your account that you created previously so now we have it installed you can go ahead and run cursor and you'll be greeted by a basically tutorial which at this point is just a couple of files there's a JavaScript and a python folder with some example projects and um some other sort of coat Snippets in various languages so I want to go over here to this python project and one of the first things we're recommended to do here is to generate some code with command K okay so this or control K if you're on Windows now ask the CLI for a game based on Tic Tac Toe so that's what they're just telling us to try out so let's just go ahead and try that so let's just do create a tic tac toe game in Python I'm going to say okay so we can see it's writing some sort of utility functions to run a tic tac toe game all right now once this is done we can go ahead and accept if we want the changes it made and honestly this looks fine for a basic game I think I don't know we could also have it write tests which could be cool but I'm just going to hit accept so now we have the game of titico so let's put one and we put here okay great okay so we saw how the game works as a CLI basically game what what if we want to maybe give make this a gooey so there's a bit of an interface so cursor instructs us to basically highlight and tell it how we want to change the game in some way so let's do that I'm going to highlight everything I'm going to do command K and um if you've done any python game sort of things you know you can use teiner so I'm going to say use teiner to create a goey for this T tac toe game and let's see what happens okay so it does the import it changes the existing code as well so that it works with all the new code okay now you can see that it wants me to accept the changes so let's just go ahead and do that I'm really not even going to check them we'll see what happens boom boom boom and I can see how this might have been somewhat detrimental to someone who's just learning how to write code so maybe this isn't the best tool for beginners because kind of robs them of the sort of the learning experience but it's definitely helpful when you sort of pretty much already know what's going on okay so I'm going to go ahead and run the game now see if we can get a UI of some sort and okay so it built it but it's actually very small I'm sure you could ask cursor to change that and here's basically tic-tac-toe with a gooey and we really didn't write any code we just sort of told the IDE what to create cool so now I want to take a look at this step number two here which is basically one of the other cool features which is that you can basically talk to um your editor and talk to the code Etc kind of like using an llm like you would chat GPT except it's sort of integrated into your environment here so I'm going to do command L and just ask it something and as it says here you can say use the at to show code files and Doc to the AI right so I'm just going to do um explain the create board function in the at main.py file right and you can see it sort of loads it up here the uh that file content and um and then you can ask the question so I'll just press enter and as you can see it'll give me a generation much like you know chat GPT would or something but as I said before the difference is that all your code is here so you can see how you can extend this to like a big project basically and either sort of interrogate pieces of of code you know use this to find bugs or even sort of explain documentation right so I'm going to stop this here so we don't use any more tokens and yeah I think that's actually a pretty cool feature and that you don't have to keep going and pasting over to chat GPT okay so let's move away from the tutorial here a bit so I'm going to say create an HTML skeleton with a title that says fake title and a body that says some random laurum ipsum okay see what happens okay I'm going to go let's go ahead and copy this and try to run it I went ahead and um pasted this into an index HTML file let's go ahead and run this take a look at the site okay so here you can see what it looks like it's pretty small let's go ahead and add a maybe a header let's see what happens when I do that so I'm going to select the body area here and just say command K add a header in the form of an H1 to this section that says subscribe to Tyler what's good okay let's see what happens all right wonderful so here I'm probably going to accept the changes save let's go ahead and check it out and here we go now what I'd like to do is maybe add some styling right so you just select the whole page and say make the H1 bright orange add a green background to the p and make the text white let's run that you can see it added this style tag and um it's targeting the elements which is cool so I'm going to accept save it go check it out and there we go Okay cool so obviously this isn't super beautiful but you get the gist okay let's do something else let's maybe write some JavaScript the last thing I want to try is maybe a more real world type of project where let's say I want to add some sort of payment stuff to a project and I'm going to use stripe for that so I'm going to say something like create a nextjs Handler function in this format that and let's just be kind of vag here has a switch statement for stripe payment web hooks let's just see what happens here okay so it's created the route this is pretty good pretty good I mean this looks about right so I'm going to go ahead and copy this and save it to this file okay now I know that there's obviously stuff missing so let's go ahead and try to well first of all I'm going to add some sort of things that nextjs would need so I'll go ahead and add some imports here probably need to do this at least this is how I've usually do it it might be different now how about we want to add one more sort of event so I'll highlight this and I'll say something like add an event for the case in which a subscription was updated how about that we want to get the uh the web hook for that see it make the edits so it doesn't need to change any of that okay cool and that looks good so we'll accept that now obviously let me remove some of these so I'm not using like extra code or whatever delete that and let's just say that for this situation when a subscription gets updated I want to maybe change something in a database and maybe I'm using a superbase so I'll say something like edit this so that a table called profiles is updated in superp base where the column stripe customer corresponds to the event. dat. object. customer data so let's just run this and see what happens hopefully it uses some sort of async function here okay and this actually looks right um so I'll accept that and if there's issues obviously you could always go back and change it but we pretty much got this written pretty quickly you could of course go on and copy pasted it etc etc but in the case you maybe haven't done this before this would be very useful of course I would recommend checking the docs making sure everything's up to date here because this is a payment thing but you can do the same sort of thing for off etc etc okay there you have it we tried a couple things I thought it was pretty cool especially in generating sort of boiler plate like a lot of these sort of uh code completion language model tools as I mentioned before there may be downside to maybe a beginner using it just like co-pilot because does a lot of Auto completing and sort of writing code for you so it may be a bit of a crutch but all in all I think it's a pretty cool tool and I'll likely be using it more in my day-to-day what do you guys think do you use another tool that has similar capabilities which one is it I'd really love to know let me know in the comments that's it for this one I'll see you guys in the next one thanks for watching bye

Channel: tylerwhatsgood

Views: 4,955

Keywords: ai, python, openai, gpt4, langchain, software development, llm, llama, javascript, web development, webscraping, beautiful soup, cursor

Id: cXAe4erSKgQ

Length: 8min 19sec (499 seconds)

Published: Wed Nov 01 2023