NEW: Cursor Composer AI + Claude Sonnet 3.5 Is Insane! 🤖 Getting Started AI Coding Tutorial (Basics)

What's going on guys Josh pook here and in today's video we're going to be looking at cursor the AI code editor and we're going to be looking at what all the hype is about with the new cursor compose feature how you can start using it in the most efficient way possible so you can start building your dream projects let's dive right into [Music] it all right guys so we're going to be going over cursor and this tutorial is meant to basically

Assist you in the best way possible if you're just getting started maybe if you don't even know how to code you do know what cursor is but you don't know about the whole composer feature or maybe you just don't know about cursor at all so I'm going to tell you everything kind of lay the foundation of what I believe you should know if you're getting into it and uh then I'll kind of show you this in action so I actually made

A video uh either one or two videos already about cursor so you may be wondering if you've been following this channel why are you making another one well if you don't know and if you've been seeing maybe some of the hype right now uh it is because of cursor's new compose feature all right the composer feature it's it's it's honestly quite revolutionary in terms of uh the developer experience and the coding workflow so uh yeah let's just dive right into it

So this is cursor I'm not going to give a huge you know walkthrough of the website but you can see here kind of know knows your code base um yeah we're going to dive into all this but essentially this is definitely recommend checking out the website they have some testimonials here it's a fork of vs code if you don't know so it's going to feel familiar to that and I would definitely also recommend checking out the dog section and here are

Some of the features code generation multiline edits smart rewrites cursor predictions and a bunch of other stuff so um and lastly I'll just say first off um yeah there's been a lot of hype on YouTube Twitter X whatever and a few key ones I just want to highlight so this is one uh post I saw by this gentleman Ricky robinet and I believe he's a Dev at Cloud oh no he's a VP developer at Cloud flare and uh this is his

8-year-old um building in 45 minutes uh basically some little app with the assistance of cursor I'm not going to play the whole thing it's 8 minutes I'll leave it in the description if you want to check it out but as you can see here it's literally just her building out this little Harry Potter Chat thing and I believe it like generates images you can name your chat or or something like this so pretty cool stuff if she can do it then

Of course you can even if you don't know how to code I just want to preface that and uh yeah so let's go ahead and open up cursor so this is what cursor is and if you know you may be like wow this looks exactly like VSS code like I said it's a VSS code Fork um mine looks a little bit different than you may have at a box one because if you're if you're asking that because I have a theme

So you can go um just like vs code you can go over to extensions and download a theme so funny enough um yeah I've known about cursor for a while I did the the video on it a while ago but now with the new composer model it's actually really forced me or you know encouraged me to actually start making the switch uh to cursor because before I was using VSS code and I was using tools like continue Dev claw Dev and

I'm I still love those tools and I'm going to continue using them like I even have them here I'm going to just so you can guys get the whole experience of cursor I'm just going to temporarily uh you know minimize my face right now so you can see the whole screen so up here I do have uh continue Dev and Claw Dev here just in case um but I've been really focusing on cursor a lot lately and uh this is just

A project I've been working on um I'm going to do some demonstrations in a test uh do uh TSX folder and you may be wondering okay well well first off when I first install cursor just so you guys know I W I personally wasn't seeing the file edit selection View terminal Etc so that was kind of annoying I mean it's just a setting in vs code as well as this bar right here I personally just like the bar on the side

Here um instead of it being on top you know you see everyone who's using cursor with it at at top here by default which is fine I just like it on the side so that was honestly that was kind of one of the main reasons what was stopping me from fully converting so but all you can do is simply you can go to the settings not the cursor settings but the actual settings here I'm not going to I I just want

To get right into the tutorial uh I just want to quickly preface this so um if you need help with this I would suggest to ask perplexity your chat GPT but you can go to settings search for workbench activity bar orientation and I played around with this changing it between vertical horizontal Etc and then um if you find your activity bar up here you can go down I believe to view and I think it's appearance and it's either in appearance or

In editor layout one of the two um but yeah that's how you can kind of change the appearance here now let's get right into the juice of uh what we're going to cover here and it is how to use cursor so I'm going to go over the basic ways to use cursor AI um to start off which is the ways you may be used to using an AI pair programmer so of course we have the chat on the right hand side

And there's I believe couple main commands um I think it's so contr L yeah contr l is going to open up the chat so you can either hit contrl l or you can just go like this right here so toggle the plane right here and then you're going to be able to see your chat okay this is kind of like where you can um talk and use like a chat interface you could maybe brainstorm here and whatnot you can add context

Files so I could add any one of my context files like for example test and then the AI will have context around this file of course um and then there's a review tab right here I I haven't done too much experimenting with this yet so I'll I'll keep you guys posted as I continue learning more and uh you know working with cursor but this looks pretty cool in terms of like custom review instructions review working State review diff and Main Branch

Focus on performance of my code look for uh any logical inconsistencies why is memory leaking Etc so this will probably be good for like reviewing bugs and whatnot but here you can uh select the different model of your choice you can add your models too so if you go over to the cursor settings here you go down to models um you can see all your models you can add models down here and you can enter in your open AI anthropic and

Google API key as well as aure and I'm just going to close this out now also one last thing too I'll say is you do want to make an account on cursor I think they actually make you do that beforehand but just if you didn't know create an account um as well as one more thing for pricing uh there is a free plan um so you get this right here but I currently just signed up for the paid plan um I

I don't know if you 100% need the I'm pretty sure you need the Pro Plan to use the uh cursor composed feature to its fullest that's what I'll say um because I think you can go control I or what is it uh let me just exit this so if you hit control I you're going to see the composer down here now I believe to actually be able to go like this open the plane so you have the big composer and where

You can type and talk to it and submit I believe you need the Pro Plan at least that's why I upgraded because it wasn't letting me without it than it was so I just want to preference preference that that uh you may need the P the $20 month P plan even if you don't have the $20 month pull plan though and you just want to use this for free you can uh use a lot of the features you can use pretty

Much all the other features with your own API keys and will mention at this time too I did do a video yesterday talking about z a uh Zed Dev or zai it's an uh completely open source um uh code editor some people like it a lot um it's very fast uh lightweight and it's 100% free um you can use their own CLA Sonet or you can bring your own API keys and then some people say they didn't like it so it's

A mix of both I like it but um in terms of like what I think I'll get the most AI quality output from it probably be cursor composer just because I think this feature is really it's very Innovative right I think this is just a stepping stone like the next it's going to like obviously AI coding is going to get even crazier and crazier but this is something that's making it a lot easier like I said for the dev experience right

Now and you'll see why in just a second um but yeah so I just want to go over the basics first for those of you who don't aren't familiar with cursor and then I'm going to get into the compos feature so if you already are familiar with some of this maybe you want to skip a couple minutes ahead just cuz I'm going to be going over the basics right now in terms of doing inline code generation autoc completion as well as

A chat feature and then I'm going to cover the composed feature um in depth as well so uh so yeah anyway so contacts chat here you can add your models you can switch models here so I can go ahead and say hi how's it going okay and I'm going to be chatting with gbt 40 right now just cuz I have that selected typically I always like using Claude Sonet just cuz it's the best at coding uh 3.5 of course um let's

Just say please generate me some um nextjs code for a home page for my um nice and intuitive with ad CN UI Okay so I'm not actually going to go ahead and run this right now but I'm just using this as just testing purposes to kind of show you um it's going to generate like I said I usually would use claw SAA just because you're going to get a better output but once you get the chat right here or the code

You can either ask it questions about it or you can apply right now so I can go ahead and click apply and apply this to my current file as you can see it's basically kind of look um uh yeah so you can either hit control shift y or select the yes or the green button here or the control n and hit and basically say no I don't want those changes so we're going to hit control Y and as you can see

It's actually pretty good Even This is gbt 40 so button card container typography we're importing from Shad CN UI and then head from shed uh from next head and then we're exporting home uh and then Coach coach Marketing Solutions etc etc so um not too bad obviously we would want to run this code iterate on it improve upon it I'm just showing the basics of how to actually use the code now once we had this have this we could either talk

And improve upon it in here or we could basically um like do like uh like I could highlight like uh this for example and I could either add to chat like this so it's now in the chat or if I hit control K now I can start talking in the inline right here I can either use like whatever model I want and then boom you're good to go so let me just uh delete this and go like this and as you

Can see as I'm typing in link again I'm getting an autocomplete right here so uh that's another thing all you do is Click Tab and then tab and there boom now I have that code right there so this is just showing you on a small simple scale but autocomplete feature is there and it's pretty useful as well when you're actually read in code okay that's that's some of the basics with the AI features now I want to get into the meat

And potatoes which is the composer all right so um the composer is really what pushed me over to actually really start using cursor just because I really like how it works so we go contr I here um you can see the little composer down here we're going to so I'll go over the main things um so there's more options here you can show history reset position here you can start a new composer chat here you can reset composer which will reset

All the work you've been doing in that composer so it like undo it um close composer you can add context here as well and what I always like to do is open the panel to make it bigger now down here in the left you can see a create new this is going to give you two options you can create a new project or a single composer so if I created a new project here I could say like back back and setup

I could go create and I could start adding like new uh new single composer um let's go here so I could basically in the now in the pro project um this is something I'm going to be uh you know doing more like I'm going to be improving my my workflow around this and I'll keep you guys updated so make sure to subscribe stay tuned if you want to see more up todate uh as I'm learning more strategies within cursor I'll definitely

Keep you guys posted but um the in the backend section you can kind of set your uh you can kind of set like a system type prompt right here so you could type in like let's just say like your um project kind of Standards like how you want to do things like whether it's like say if I'm setting up my back end you know maybe I'm using super base uh drizzle omm you know whatever text stack you're using whatever we flows

You typically go about like let's say if I wanted to say here's like my off procedures Etc right so you can maybe put some sort of kind of overarching uhop or standard operating procedure for your workflows in here you can also create Focus files so if I wanted to say hey for this specific part let's say I'm doing off right in my app I'm obviously going to maybe want to reference and F have the focus files right here of all my

Different off uh files that I would be working on and then you can see as well here the different uh if I go back here the different composers within this project and you can just click new composer to create one and and then I'm going to show you just talking with a composer in just a second and yeah so that's really cool you can kind of organize your projects in this manner and uh and then you can have different composers within

Them now I'm going to show you talking to the composer in just a second but one other thing I want to mention too this is a little trick I mean it's this is something I actually got from this guy on uh Twitter he basically just uh I saw him tweet about using prompt folders so uh this is something I'm going to be using more of but essentially he um basically just creates prompt a prompt folder like so and then within the

Prompt folder you have markdown of different things whether that's uh your Tex Stacks docks whether that is um you know like your standard kind of like your standard operating procedures or your prompts and you'll just put that in markdown so like for example new file um off off procedure right uh dot um MD boom and then I could just start typing like my mark like my uh how I want to go about it like okay I'm going to be using Clerk

Or I'm going to be using um next off or I'm going to be using super base whatever the case is you can get the info a lot of it from the docs uh of the official docs and then then you when you're actually so let me just delete this and then when you're in something like composer you could actually whether you're in composer or potentially even focus files you could um reference that specific thing right and also too guys I mean

This is important because when you're talking to AI like I even do this in Claud Sonet within my projects you're referencing new updated docs because docs change right certain things can be depreciated um certain certain package files certain ways of doing things like when I'm working with superbase they no longer recommend the helpers um for off and all that stuff uh but quad Sonic and a lot of the AI models were trained on those old docks same thing with like next

App router you always got to specify hey I'm using an app router not page router because a lot of the models were Chang trained on the old docks so having a centralized system of like new updated docks and then being able to commun unate that to the model in a most efficient way that's really what coding with AI comes to uh comes down to and then also knowing the basics and knowing a little like educating yourself Al about how coding actually

Does work so you can kind of be the conductor be the manager of the AI model that's kind of how I view things and yeah so guys this isn't like a video where I'm going to show you how to build a full end to end uh you know backend frontend app um if you want me to show you like do a video where I actually like you know build something cool or build a little something walk you through using cursor let

Me know in the comments down below I just want to get you guys up to date with if you're new if like I said at the start if you're new to cursor what you're missing out on or what's the all this hype about or what's the new compose feature because even me like when I started seeing the hype I'm like okay why I already cover cursor what's the so good about the compos feature now let's go ahead and just quickly test

Out the compos feature so let's just say um so I'm in compos right here okay so um right so actually so it's actually good at even refactoring or improving upon code so um please let's just let's just link this file as context right here so test and please please analyze my code and suggest multiple improvements to make it more efficient and a lot more modern okay I'll analyze your improvements to make it more efficient here are several suggestions use okay so

Of course it's going to say use app router use a page. TSS because I'm using test. TXS which won't even render um create a separate component for the main content so it's saying create a homepage um use tail one CSS for styling of course create custom UI components such as button use typescript more efficiently Implement responsive design optimize performance if I went ahead and clicked on select or accept all it would actually go ahead and start doing this yeah I'm not

Going to do that right now just cuz I'm actually in a project and I don't want to mess it around but um yeah and then you can iterate upon this like and also too you can click on forward slash uh you can see reset re uh reference open editors um and if you also hit at you can um you can Target different files folders code web docs git or codebase so pretty cool stuff um the main thing that's different really about

Cursor right now is this compose feature and even within this video like I'm trying to explain it in the a simple way as possible once you actually start using it you'll kind of see the power behind it in Truth um so I would suggest to start using it take these Basics that I showed in this video and um start building something cool and let me know if you have any questions and let me know if you want me to do a

Deep dive video through how to actually build um okay also one other tip I want to give you guys is when you're so let's say I'm creating a project from scratch what I would maybe do this is just an example uh let me just pull up uh this one and I would maybe type out something like hey I want to create um a pro I would create an in-depth prompt like I want to create a project I would really explain what

What functions I want it to do what text stack I think I may want to use etc etc and then within the chat side of things you may get like an action plan okay I need to do this I need to set up off I need to connect my database I need to do etc etc like a 10 step plan whatever the case may be and then you can use each step and you can kind of Chunk that into a pinpointed

Um like pinpointed action plan with the compose feature so then if I go to compose um control shift I uh then I could start okay plugging in step one okay step one I need to um set up the front end I need to connect to kind of get a u the UI set up um and then I could just ask C uh composer hey this is what I need to do for this for step one please do that and it's going

To give you all the code and you're just going to have to click up accept and then it's going to set up that the file structure create those files you're going to want to run Dev test it out there may be a couple bugs Etc so you're going to have to change that then go into step two step three step four Etc and kind of do it that way um you don't want to give it too much at once because it

Could then it could start messing up and you know it's really all about how you prompt it and interact with it and all that good stuff that's really what I really want to stress to you guys I see a lot of people struggle with talking to AI or doing coding with AI just because they're actually not prompting it good enough all right just to be quite honest so yeah I can't read your mind you really got to detail things and that's

What I would stress to you guys but other than that guys hope you enjoyed this video hope you got some value from it I know it's more of like a um you know Theory type video and going over exactly kind of some theory about how to actually use K composer which I think is important um if you're new to cursor composer or even if you are using cursor composer hopefully you did get some something out of this video um like I

Said though if you want me to actually build something and I didn't want to just like build a snake game or build a calendar like we've seen that a million times so if you actually want me to try to build something somewhat cool or whatever some sort of interface for you guys let me know in the comments down below um but if you're new Here We Do videos on AI automation business growth bunch of different stuff every single day so if

You like this type of content make and you got some value here I definitely appreciate smashing that subscribe button smashing that like button and then also too guys if you haven't joined our free community stri community our free Facebook group free Discord Channel link for that will be in the description Down Below guys other than that guys uh let me know what your thoughts are down below in terms of cursor maybe even Zed uh if you have any other favorite AI

Pair programmer whether that's Claude continue Dev whatever have you tried cursor yet do you like the composer future other than that guys I will see you in tomorrow's video keep hustling keep grinding and of course for guys accelerate your stride take care