Video33 min watch

Windsurf VS Cursor AI IDE Showdown!🤖 Best AI Coding Agent Build NextJS App Codeium Claude Sonnet 3.5

Transcript

4,909 words

What's going on guys Josh Bok here and on this channel we've covered many different pair programmer AI IDE we recently covered Aid we've covered wind surf which just launched recently we covered cursor many different times pair AI the list goes on in today's video we're going to actually be building out a endtoend application called task flow using cursor and wind Surf and seeing which pair programmer does a better job let's dive right into it all right guys so I'll leave link

Down below to a couple videos I did on cursor and wind surf if you want to see those individually getting those set up as well as I'll leave a link to the wind serve page and the cursor page so you can download those if you haven't already as well as I created a document which you can actually access down below as well to get all the different overviews The Prompt templates and the PRD that I'm providing to actually go ahead and

Build this project end to endend on both wind Surf and cursor all right guys so let's dive into actually building this all right guys so just so you know where we're starting at I have two exact projects set up in both wind Surf and cursor here these are both nextjs uh projects right now so they're nextjs app router um we also have Shad Cen already set up on here so all that's literally it and we just both of these have have

A prompt folder right here with PRD and we're going to use this as context right here this is in the document that I'm providing you guys so you can take a look at it more in depth if you want to see exactly how we're prompting this so we're just using a markdown file right here giving a project overview um the key features the technical stack right here which is shad Shad CN UI react DND for drag and drop um cand board

Local storage API recharts for Analytics Lucid icons and tail one CSS we have the prompt stages overview right here the five main stages and then the PRD right here the overview user stories T management time tracking analytics data management technical requirements so front end components header cband board task card task form analytics dashboard data structure right here uh local storage schema and then design requirements so not too you know not too basic but not too Advance we just got a nice

Overview there which will kind of help give us uh give the IDE some context to how we want to build our project okay so I also have our prompts there's five prompts that we're going to be using as you can see they're not basic prompts they're a little bit longer prompts all right just so we can tackle each aspect one by one right we're going to start with prompt one which is the header and we're going to start with cursor all

Right guys so with cursor there's really I guess two ways you could do it or you could do a mixture of both um I'm going to be using a composer with a notepad you don't know what notepads are it's just the way that you can give it context right here and you could also give it um context right here like with files so let's just go ahead use composer um so you can see this notepad task flow we could put the

PRD in there or specifically use the PRD in a markdown file either way it really works let's go ahead with our first prompt right here both of the uh Ides will be using CLA sonit 3.5 so to get the best results so as you can see it's creating the header right here as this one is going I'm also going to run the exact same prompt in Wind surf all right so in Wind surf I'm using Cascade I'm referencing the PRD right

Here while it's on at 3.5 we're using the right mode which is going to create multiple files and then we're pressing enter okay back to cursor we can see that it created the header the layout the theme provider now it's asking us to uh install next themes Lucid app we can go ahead and run this like so PMP install uh next themes Lucid react let's install that okay now we can go ahead and run npx Shad CN we're adding the latest

Button drop- down menu okay so now I'm going to go ahead and click on accept all okay so looks like we're getting an issue um I just tried running PNP run Dev right here on cursor so we're having an issue right here I'm just going to copy this like so um and we're going to just paste it into composer okay something wrong with the import path which actually makes sense okay it's telling us to run the button chaten command okay so

We had a few issues I simply just fed them back into composer to troubleshoot and now you can see we got our header right here task flow we got a little Lucid icon right here analytics board um so nothing in over here yet but we do have our header and we do have a dark modee and light mode right here seems like there's a little bit of an issue there we'll troubleshoot that in just a second all right let's see where

We are with wind surf so if we look at the first wind surf prompt it basically um created the header component then it updated the layout right here added the theme provider um created the header. TSX updated layout. TSX fully functional responsive Etc so let's go ahead and accept that and let's check out how this actually looks okay so failed to compile we're missing I think a couple components so let's go ahead and paste this into wind surf okay so it's

Installing the required components right here so as we can see okay so that's a little Annoying It's using Shad xn- UI which I believe is incorrect and I specifically just told it not to use Shaden - UI to use just Shaden right here see Shad xn- UI is not recognized even I literally just said don't use Shad CN UI use at Shad CN now I'm saying no I just told you that it's at Shad CN not not Shad nuui okay so

With the Cascade en counter an internal error at this step I don't know why that is okay so after a bit of troubleshooting we got it up and running so as you can see like I mean I guess it could be a variety of reasons one we're using clo on it two we're using the exact same prompts and everything but as you can see this is almost like identical what we have with cursor like almost identical this with light mode this

Is black with light mode so that's really like one of the main uh only differences no it is the exact same icon uh same everything pretty much so let's go ahead with prompt to okay so now that we got the header we're going to do the task creation so we're going to use this prompt right here and like I said all the prompts are linked down below well this whole document is what we're doing is creating a task uh dialogue that

Opens from new task button that and includes title blah blah blah blah blah create a task card component that displays all this information we're showing the requirements right here Shad xen's dialogue form input select button and badge components uh local storage and then the structure so let's go ahead and use this with cursor so one recommendation like I showed you earlier if you're using Shaden and it's doing installs with one of these tools make sure you specify that it's Shaden not

At Shaden UI oh my gosh see it I don't know why it does this it does for slui this is really annoying that it keeps putting like shadsy and dash UI or shadan for slui that's not a cursor or wind problem that's just how um AI llms are trained on like outdated stuff so kind of annoying he so it gave us the right commands finally after I said not Shad c4i or Dash UI it's just chy Nui thing is I think

We actually already have these components the button and the we have the drop down I'm going to make sure we have the button are you tired of pouring thousands of dollars into appointment Setters only to watch leads slip away imagine having a team of elite sales agents booking qualified appointments for you around the clock no more wasted time on training no more frustration with performance and no more draining your budget on inconsistent and expensive call centers introducing stride agents AI powered

Appointment centers that work 24/7 never get tired and book appointments while you sleep trained on thousands of successful conversations our AI agents outperform human teams at just on10th of the cost join the ranks of businesses that doubled their appointments and booking rates in just a matter of weeks don't get left behind in the AI Revolution visit stride agents.com now and transform your entire sales process with Cutting Edge AI technology it's time to accelerate your stride with AI agents okay so I

Said where's the task page or anything I just see the default nextjs website which is what I see here so it basically said that it is going to create the page here um and then add that so let's go ahead and accept Okay so it's telling us to install some Shaden components so I'm installing these okay so we got the Shaden components now I'm going to uh install react hook form right here okay we're having some issues here so I'm going

To paste this over here into cursor I think we're just missing this text area component okay and boom now we have our task board as you can see here let's go new task we can add a test task here description medium we have a date pick right here that seems not to be working the best and create task it doesn't look like it's actually creating anything but at least it looks kind of cool okay we'll come back and try to improve

This a bit in just a second but let's go move on to wind serve okay let's go ahead and run that same second prompt in Wind surf here okay so luckily it is picking up to use Shaden latest and we're adding the dialogue form input select badge calendar pop over and toast so the cool thing about wind surf of course is that you can easily it can easily run these commands for you in the terminal which is kind of nice okay

So it created a types file created a utility function for task storage created the task card component the task card uh the task dialogue component okay now that it's actually creating a page to demonstrate the task management interface this is actually something that cursor mess like didn't mess up with but it just didn't do I had to tell it to create the interface so um at least from what I saw maybe you know it didn't maybe it I had to tell

It to create the interface okay so uh shii test area let's go ahead click yes okay got some import paths that seem to be incorrect I'm pasting this into wind Surf and just so you know it basically said it created types utilities components features right here and the dependencies that installed okay another issue I'm just going to paste it back in to Cascade here looks like we got something here okay we got test test okay this is like okay I guess

They're exactly okay so this one's at least working okay so we got task boards not perfect there are some issues here but at least we're seeing the task appear here see it uh a little toast down there once we add task you can see cuz my head's covering it but there's a toast um right here test created now there definitely are some issues just like the cursor one but there are some things that it is doing correct all right without wasting

Too much time of course we can either spend you could spend more time making this obviously better maybe we'll come back to that and optimize it at the end but let's go on to our third prompt now this is going to be for time tracking okay so this says make a can board can band board interface drag and drop uh create C band board component cam band board column task card technical requirements here and all that good stuff so the cursor

One already actually has the can ban stuff but I guess we'll just post this paste this in anyways I'm going to paste this into wind Surf 2 as we wait okay so it's saying install DND kit it's creating the cband column as well as the cam ban board component created the task card as well as the updating the can band board page right here okay and we're going to click accept all all right so as expected we're getting some issues here

I'm just going to copy and paste this it looks like a lot of issues you know we are getting it's just simple Shad xen components not being installed properly which uh is understandable I guess okay and boom now we got that feature here so we can is it working oh no it broke maximum updated depth exceeded this happened when a component is completely recalls instead of okay so let's try that one more time see if it works no crashed again react

Limits the number of nested component updates to prevent infinite Loops okay so I'm just going to paste that in two cursor okay so I'm saying when I try to drag task I get and then I paste it in that error okay so let's see if it works no same issue okay made some changes here added use memo for task by status calculation yeah I let it know it keeps crashing I also let it know when I add a new task it

Doesn't show up okay now we're getting another issue group task status right here I'm just going to copy this okay so I'm still working on the cursor one but I'm actually quite amazed because if we go over back to wind surf you'll see I literally just gave it that prompt that first that second prompt or third prompt whatever we're on and it made all these changes created the gamb ban column component test card component um enhance pass card Fe technical features

Etc and it's just working out of box like I'm not going to say 100% that it I mean okay it did a better job in this sense um but it could be situational that's the thing it's not like just cuz it did a better job in this specific case not going to give the win yet to wind surf by any means we're going to still continue building this out like if we look at wind surf one it's actually creating the task

Which cursor didn't do I like how it uh goes like kind of dark here too when we're creating a task I kind of like that and it has a counter right here so we have one done task we have two in progress now Dragon drops working perfectly okay looks like we did just encounter our first error and now we're getting a second error right here I'm going to paste that into Cascade okay looks like it may have fixed it let's go

Ahead do test okay so now it's a bit different it's requiring this okay goe add to tag task created but it's not showing here all right so that's an issue okay while we're trying to troubleshoot the cursor one it looks like um uh it looks like wind surf fixed the task not showing so now at least they show one thing I just noticed though is when I try to drag it over it looks like there's a side slider right here which

Is kind of annoying you see how it's there's a side slider and it looks like it's uh not able to drag over to the right or left it's only able to drag upwards or downwards and now it kind of disappeared so having some issues in both of them right now now okay looks like it actually finally fixed it in cursor okay it just disappeared let's see if I do a test a test task isn't showing up but at least it's not

Breaking okay I'm just going to go ahead with the fourth prompt here so this is the analytics prompt so creating an analytics dashboard time tracking analysis productivity metrics uh data processing visual requirements Etc now keep in mind guys if you actually building in a project I wouldn't recommend doing it like with these huge prompts like this I just wanted to kind of fast track the process with these IDs and kind of see you know what they'll what they would really do

Um but you know you can kind of go incre more incrementally I would suggest um as you're building it out you know building it out flushing out some of the the sticking points you know doing a little bit maybe of a longer prompt a medium prompt and making it obviously a lot more custom um to your specific use case not just having these cook cookie cutter prompts that you have pre-made from the start but for the sake of this video I

Just wanted to do this so we can compare them side by side to be honest up until this point both of them have had a decent amount of sticking points and I tend to find when you are creating something completely from scratch with these you know tools you can run into some issues especially with like you know the shots the end issue and whatnot but um I would maybe give the slight Edge so far to wind surf but at the same

Time it's not like it's blowing it out of the water both of them aren't like production grade apps by any means at the moment okay so with cursor we created an analytics page a date range picker uh component and a hook for local storage let's accept this and with wind surf we got an analytics utility uh task overview time tracking productivity metrics analytics page and we can accept both of these and with both of them we are getting some errors okay

So we'll troubleshoot the cursor ones first okay so it's saying install recharts here we'll accept this okay looks like we got another issue I'm going to paste this in okay as I was working on this looks like my Cascade has like kind of crashed here so I'm going to have to restart it okay here is the cursor so far so looks a lot better you know well this is the analytics page so the board is here and we got our analytics

So we got so actually did a pretty good job we got our task overview here completion rate in progress completed uh status distribution right here with the charts um priority distribution daily time spent hours time spent by status hours top time consuming tasks productivity metrics productivity score average uh daily active time task time time period task completion Trend Peak activity hours we got our date picker right here so all in all I'm actually kind of happy with so far uh what

It did with this prompt okay at least with Cascade it actually did we're able to pick up back where we left off so no problem there okay and wow oh damn so okay we're having an ISS one error here actually I think this could be fixed pretty easy I think it's to do with the date yeah probably to do with the date here let's paste this into wind surf wind surf's out of box looks I mean it looks probably I mean

Looks better it has dummy data or whatever this is um right here so it has nice graph status bar graph right here um this is pretty nice time by status Time by tag time consuming task okay so one like I said with wind surf we can actually see Tas here and and it fixed that error really quick um already so we can see our task we can see productivity score daily activity timing completion go to our board here we can see

Total task five so all in all we got like the task board somewhat working already not perfect by any means like I said you could spend a lot of time and get this to work better um but yeah we got the analytics board here okay now we're getting that error again okay now the data seems like it went away I could troubleshoot this toggle this I'm actually just going to go to the fifth and final prompt and run this on both

Of them like I don't want to spend too much time I've already spent so much time troubleshooting each of these but I kind of want to just like let these apps now run with the prompt and see what kind of one comes out better cuz of course with both of them we could optimize them and you know get them probably to a similar state but let's kind of see what works better at a box and obviously if you run this test

In a different app with different prompts it could go either way that's really what I'm seeing and yeah let's just see what we get here okay so I'm doing the final prompt here with cursor Implement a robust State Management so State Management data persistence performance optimizations let's just go ahead well we already ran it so um it created some types for our state and creating the main hook right here let's go ahead and accept and same thing with wind surf um

It created the types for inter and interfaces created storage utilities created use task flow hook and created a context provider to make the state available throughout the app okay let's go ahead and accept all right so to finish things off I told it to add a sidebar um I told both to add a sidebar so it's doing that right now okay so the task bar or the sidebar is working on the Wind surf one definitely not the best okay and I

Got it to work now on the cursor one still not the best by any means um yeah definitely glitching out but I think you guys get the point here um to be quite honest both of these apps are definitely not by any means nowhere near like complete whatsoever um you know when you the way I would personally recommend it it is a little bit challenging when you're doing both at once and you're using the same prompts at once and they're predefined

Prompts and they're kind of uh larger prompts I personally wouldn't recommend that I would personally recommend focusing on one Ide at a time and you know developing the prompts as you go depending on how the AI is generating um you know uh the the last prompt so uh you know they didn't turn out that great you saw there was I'd say there was some pros and cons with each for certain things like wind surf I tended to find I guess maybe

Did it okay wind surf probably was a bit easier out of box now this like I said it probably is a case-by casee basis there's definitely a lot of variables that are at play here so honestly I can't Crown a winner I can't say this is the end all Beall um this is just a case study and I would recommend you guys if you're wondering what is the better ID to try them both out and you can't just try them out

For one specific project you know and say this is the best some people say oh this is the best that one sucks if you actually haven't used it for like multiple weeks and you know gone through the ins and outs then you really I find that it's kind of hard to say um you actually have to give both a real shot at it you can't just watch this one YouTube video and determine fully what is better um because they both have

Their pros and cons when you're at this certain level some Ides of course or AI pair programmers it's just night and day but for these two they definitely are kind of some of the top ones that we're seeing right now and a lot of people are some people are saying I'm wind surf some people are saying I'm team cursor um but let me know what your thoughts are in the comments Down Below guys I hope this video was somewhat helpful it's

Been like 2 hours of actually recording this so it's a bit of a long longer one you know waiting for all these different prompts to actually generate and troubleshooting some of them of course if I was working on one individual project which I will do in future videos with both these tools then it's a it's a little bit uh then I'm able to actually spend a bit more time making sure each of the like making sure the project actually functions a

Little bit more um but uh all in all I think you guys still were able to see certain pros and cons with each one of these let me know what your thoughts are in the comments Down Below guys are you team wi surf or team cursor if you're new to the channel guys we upload videos about AI automation business growth Marketing sales Etc so if you like that type of content you got some value here make sure to like the video

Comment down below and subscribe to stay up to date with the uploads thank you guys so much today we recently just hit 13k subscribers so 20K on the way hopefully we can have a huge month in December and finish off the year strong and potentially hit 20K subscribers that'd be insane I'm extremely grateful for all you guys watching and supporting really means a lot to me let me know what you guys want to see as well for Content finishing off this

Year as well as going into the next year I've actually been making a video a day for like the last s months now so one consideration that I was thinking of is maybe focusing more on quality versus quantity but let me know what your thoughts are about that in the comments down below if you want me to keep making a video a day or maybe I should make two to three to four videos a week and focus a little bit more

On quality um it is a lot of time you know doing a video a day but we'll see how it goes let me know what your thoughts are in the comments M down below also too guys I just created The Stride AI community and I'm going to be posting a bunch of value in this community I'm actually making a full-blown course and I'm giving away so much free resources in here like it's going to be insane the amount of value that's

Going to be in this community it's going to be packed full of AI stuff marketing stuff sales stuff whatever the case may be you're definitely going to want to be in here it's 100% free so literally it's extremely valuable you have nothing to lose anyways join the link in uh in the description as well as the pin comment to join the stride AI Community for free and then also too guys if you run a business you need help with Marketing sales

Automation implementing AI or AI agents like AI appointment centers Ai call center into your business book a call down below executive.com apply and then go to stri community.com to join our Facebook group and Discord Channel as well other than that guys I will see you in the next video keep hustling keep grinding and of course guys accelerate your stride take care

Latest from the blog

View all