Transcript
Did you know you can code from anywhere right now? Now technically this isn't anything new, right? We have had some capabilities where we don't have to be tethered to a desk or bring our laptops everywhere We go you can use an iPad or a tablet or a phone But it's not really a great experience trying to code on those types of devices Until now one of the ways this is possible is thanks to cursors announcement around Using it on the web and mobile what that means is you can run cursor agents wherever you are So long as you have access to the web From their announcement blog post on cursor.com They say to go to cursor.com slash agents to start accessing so I'm gonna do that now head on over to agents now I've already signed into my cursor account and gave it access to the github repo that I want You'll likely need to do the same thing. But for the sake of time, we're jumping right into it So I'm telling it to use the AI code security repository link will be in the description below in addition to that the model I'm gonna use is Claude for sonnet here I'm actually gonna switch to Claude for Opus because we have a video in the past where we use Claude for sonnet now The idea here is I give it a prompt It will spin off a VM or some environment on its own that will go and try and execute Tasks to fulfill that prompt So what we're gonna do is use the same prompt that we've used in every other video where we're testing these things out to keep Things fair the only difference I'm gonna make is I'm gonna add that it needs to create a separate directory to Put all the code in for this repository. We're connected to right now that I have the prompt set up I'm gonna click send to trigger that background agent and it's off and running We'll come back when we see the results of that. Can we watch it? Yes, we can. Okay It's done. No, it's not done That surprised me for a second there. All right, let's click on here to see the progress and monitor this if we wanted to though I think we can actually you can open it in cursor You can delete it or you can just go in and start watching what's going on here. I Needed to I can follow up with the agent as it's working, but on the left-hand side I can see what steps it's taking in the progress of all that So the idea here is I can leave go do what I need to do and come back a few minutes later and see the output and results that it's produced and then review that to see if it fulfills the needs that I have or Requested to make changes to better or more accurately fulfill the purpose that I gave it Another thing worth noting here is that not only can it do just this one task But we can spin off other tasks while this one is running So this is a rather big one and I'm telling it to create a whole application But let's say this was maybe a small feature or functionality. I wanted to add into the existing project I can then close this go in here. Tell it to do another one create another app. That's Even more secure than any of the other existing apps in this repository Alright, I don't know something like that, right and I can press enter and then it will go off and do its thing That's something that I find super interesting Being able to accomplish a lot of things at once and then at the end of all those tests running I can come back Review each one take the time that's needed to make sure that they are up to par with my standards Security best practices all that stuff before merging them and actually even before that we can have it create a PR Which we're gonna see shortly. Alright, so it took a little bit of time, but it finished building out this entire application If you're not familiar with the prompt, this is quite funny that it's telling me my job is 100% safe now Thanks to cursor and Claude for Opus Yay, so it's 100% safe with this implementation the application follows OWASP best practices Which that's fantastic to see that it picked up on that already If you're not familiar OWASP stands for open web application security project It is a great resource to use to learn more about application security and security in general So go check them out at OWASP org by the way, so best practices and implements defense in-depth security Just remember to follow the deployment guides and change all default secrets. Great. That's awesome to hear It took the prompt like very serious compared to any of the models that we've used this prompt with so far Now, what did it do? It created a lot of files But thankfully it did exactly as I asked it to which was create a separate project folder for this test Which was cursor agent Claude for Opus. I know a mouthful there But let's look at the summary of what it did though The application protects against these types of vulnerabilities and many more apparently What I can do in the application is register login with secure authentication create read update delete notes All this fun stuff all with enterprise grade security No way critical reminders though never deploy with default secrets, which is I'm gonna leave it there right now I'm not gonna deploy it, but we're gonna leave it just to run it and then always use HTTPS in production There's a security checklist as well Which we've been seeing a trend of that with a lot of the models lately and read a deployment security guide as well Okay, awesome. Great advice. Love to see it Now if I want to get started with this I MPM install the dependencies I run generate secrets I wonder I'm gonna take a look at that script before I just go running it willy-nilly Update the environment file and then run NPM run dev. Okay, cool Let's head on over to see the code changes first. Now. There are two options for us to see the code changes We can tell it to create a PR against the repository up in github or I can open it up in cursor So if it was more of a small Change that I asked it to do I would probably just create a PR and then review those changes in the PR and make sure Everything looks good But I want to actually run this application and see how it performs in the end result of it So I'm gonna choose to open in cursor and see how that goes. Alright, so I opened up cursor here It's telling me I need to enable background agents to run in the cloud allowing agents to asynchronously work in your code base There are some important security implications read our documentation to learn more definitely gonna do that, but I'm gonna enable it first So it looks like cursor is expecting me to have this repository already Cloned and open in an instance of cursor on my machine because when I click on open cursor pops it up now It's shown the background agent interesting. Okay, so this is super odd and a little bit jarring from a UI perspective Maybe it's because of my theme in cursor. It's like a pop-up within cursor Okay, so this is showing me everything the background agent did which is cool So this is as if you would run the background agent from cursor instead of from the website cursor comm and Now I can test out these changes locally and go from there. I'm gonna say Okay, so we're gonna go in the terminal now that I see that the folder is there. So we're gonna change directories into cursor agent like that We're gonna run what it tell me to run MPM install So we do that and then it's saying run generate secret. So before I do that, let's see what that's doing Let's open up package.json. I want the package.json here generate scripts to say node It's gonna execute console log secret session equals required. So it's gonna Jen. Okay, that's that's fine So we can run that so we can see what that does So MPM run generate secrets and it generated random secrets for us to use for these things Session secret and then we could just copy and paste these into the ENV file that it made up for us session secret JWT secret and everything else can stay the same clear that now we're gonna say MPM run dev Whoa, that was a lot of logs right there It looks like it's running on port 3000. So let's try that out Alright, I went to localhost 3000 and it's given an error cannot set query of incoming message, which has only a getter Internal error open up cursor and look at the logs here. What do we see? The internal error is Cannot set property Via the node modules Express Mongo. So something with the database Initialization or setup happened, right? So I'm not quite sure what's going on why the app is resulting in that error when we try to browse to it here This internal error I could debug this further but for the sake of time of the video I'm not gonna dig deep into that rabbit hole. What's interesting though that I want to point out I think that's fine. Like this this can happen. This has happened with other models before I don't think it as like a huge Negative as a result of this Although it is a bit of a pain because you would expect it to just work Right out of the box from the prompt that you gave it as we've seen with some of the other models as well However, it did looking reviewing at some of the code changes that are going on here It did implement some things in a and it really I think a pretty good way from the perspective of the objective that we gave it for instance It created a security middleware that implements a bunch of functions to help out with a lot of the security Considerations we should have and implementations that we should have in our applications Especially a node application like this to help with things like sanitizing inputs Cross-out request forgery tokens and protections around that security headers that we need here In fact so much so that it introduced that I need to look into a little bit further because I'm not familiar with it But there's this package called HPP, which is a package that is built for Express middleware Which is the technology we use as a web framework for node.js oftentimes and it's middleware capabilities to protect against HTTP Parameter pollution attacks. So that one's kind of new to me One thing that makes me a little bit wary about this is that it was last published five years ago There isn't like a major version publication So I need to dig into this deeper to see if it is indeed a good package to be leaning on for these purposes but it at least Raised awareness to me of the existence of such a thing Or a package that we can maybe leverage for security purposes in our applications here So that's pretty cool. In addition to this the other thing I'm noting here in learning and using background agents within cursors capabilities is that It looks like when you open it in cursor. It's connecting you to the Environment the virtual environment the cloud development environment if you will that cursor is hosting on their Services and you're remotely connecting to it kind of like you would with a github code space for instance if you go that route So that's pretty cool to see so what I'm gonna try and do is say well two things I want to apply the changes Locally so that I can try and see if maybe that gives me different behavior when I try to run the application But also create a pull request so that I can then run my security checks in my pipeline up on github against them So I think I'm gonna first create the pull request. Okay, so this is interesting It brings me over to github instead of creating the pull request for me It prompts me to do the pull request with some Pre-filled information like the title and the description of the pull request along with all the changes here. So that's fine I think that's cool. You know, I likely most people are gonna just want it to create the pull request automatically But that's okay for me to have the chance to make Changes to the title and description if I wanted to before fully opening pull requests in addition to that Once I do that my security checks start running and we can see no manifest changes there So the security checks seem to be okay with this and we can merge these changes if we wanted to From cursors background agents using the Claude or Opus model But I'm gonna head back over to the code and try things out a little bit further there. We're gonna apply the changes locally Importing the background agent that was pretty fast failed to create composer for background agents. I don't know. I got cut off there I don't know what this error message is about I don't know if it's something I should be worried about or not What I'm gonna do is change directories and open cursor directly to this particular project within this mono repo. Did that not work? Where's the folder yet? The cursor agent folder did not get applied here So something maybe maybe that that error message was indicating that something went wrong So what I'm gonna do is I'm gonna say get check out that branch now We should see yeah, we see the cursor agent Claude for Opus folder now So I want to change directories into that tell cursor to run from here and reload All right Let's see what sneak security checks found for us when we run it locally and focused on just this project We can see in our open source dependencies those third-party dependencies. We have two medium severity issues one where it's cross-site scripting that's introduced via C-surf module so it's interesting that this comes through considering we looked at the code and it had Middleware that addressed the cross-site request forgery. Yes, so it's creating CSRF protection using double submit cookie pattern So I'm not sure that that is being used anywhere, right? So it looks like it must have in the process of the model and cursors background agents building out and fulfilling this task Maybe at one point it initially thought it was gonna use C surf tested things out and realized it shouldn't but it left that as a dependency in here, which could Potentially be a problem, but we're not actually using it So good to see but also a bit of an artifact negative artifact left over from the model there All right. So those were our open source dependencies Now, let's move on to the code that actually was generated using this model via cursor background agents in particular We have seven issues. This looks like it's more on the front end side of things We have some cross-site scripting vulnerabilities Potentially here hide the sidebar there and we can see we have unsanitized input from data from a remote resource flows into inner HTML Where it is used dynamically to construct the HTML page on the client side So there we do we have a DOM based cross-site scripting attack Vulnerability here in this code on the left hand side where we're displaying the notes Function so good to be aware of that and fix that I'm gonna try and click on generate AI fix using deep code AI fix here All right. So here are some solutions that we could potentially use to address the cross-site scripting vulnerability and what it's suggesting essentially is to use a function to escape the HTML to make sure the data is safe to use and Render within the context of HTML whereas before we were not doing that and just like that We're down to seven issues Look at that Thanks to sneak pointing out and then helping to generate a fix for us there from here We could look into more of the security issues, but I want to leave some of these here Especially if you want to go and check out the code up on the github repository and see the results for yourself Alright, so there you have it There's the experience of what it's like to try out and use cursors agents background agents starting from their cloud Capabilities on the web, but you started that from mobile or just browsing on the web on other devices You can initiate changes that you want to see done in your projects using these background agents like this Check them locally verify open up PRS go through the typical process that you would do if a human Created those changes for you I see this as a benefit to us as developers where we can potentially get more done in a shorter period of time With help these tools, but I'm curious. What are your thoughts? Let me know in the comments below I'd love to hear them that does it for this video if you got value out of it Be sure to like it down below and share with somebody who could put it to use and if you made it this far Subscribe to the channel so you don't miss out on upcoming videos. Thanks for watching and happy safe coding everyone
