OpenAI Codex in your code editor

And we'll roll in those cameras. — Great. Thank you. — Yeah. — Hey everyone, I'm Roma. We've been steadily improving Codex to make it feel like a more capable and reliable coding collaborator. And for us, it's very important for Codex to be everywhere you work. And that's why we launched an ID extension. You can now have codeex right in your code editor, whether it's like VS Code, Cursor, Windsor, or many others. And with me today, I have Gabriel, engineering lead on the extension to give us a quick tour. We on the team have been working really hard to bring lots of new things to Codex and I can't wait to show you. — Amazing. Let's dive in. — So, I'm working on this OpenA FM project and I noticed that it's using service workers. There's this interesting return clause. I'm going to go over to Codeex

and just ask it why. So, what is this clause for? You'll notice that there's an autoc context button that tells codeex everything that I've recently done in my IDE. — So what that means here is that basically you're using GPD5 codeex the new model we launched but you're kind of like I'm guessing prompting it a little differently when you're in the — ID. Exactly. So in this case I've just said what is this clause for? And it said it short circuits the effect when the browser doesn't support service workers which makes sense. If it determines that something is easy or a simple chat prompt it'll usually respond pretty quickly. Why don't you gonna

navigate the codebase a little bit and um let's pick something to implement. — Great. This button component happens to have a to-do to add a hover state. — Yep. — And if you have codeex installed, it will give you an opportunity to implement any to-do comments with codeex. So if I click it, it's going to kick off a local conversation and give Codex all the context it needs to fix this. — That's awesome. So anyone that has like any to-dos or any task in their backlog can just like start sending them over to Codeex. Yeah, that's right. — Can you show us a little bit like what's happening behind the scenes now? — So behind the scenes when you ask Codeex to do something, it starts exploring your codebase and running commands and you can see its progression as it's going along. First, it's reading code and then when it decides to run commands, it runs in a safe sandbox that ensures that it's not going to modify files outside of your project. And if the model ever needs to do something that it thinks it can't run successfully in the sandbox, it can ask you for permission. It explored the codebase. It updated the button and then it made a bunch of changes at the end. You can then review the changes right in your IDE to see all the changes it made in one place. Y — but I think we should just go see if it worked. — Let's do it. Moment of truth. — Hop over to the browser and I'm going to hover over these buttons. And as you can see, there's a nice subtle hover state where it the shadow expands, the card shifts up a little bit. I was looking

around the site and I noticed that there's a few other elements that also don't have a hover state. So, what I'm going to do now is I'm going to take this conversation we just had and I'm going to move it from local into the cloud. And this is going to use codeex in the cloud to continue this task without taking over my computer. — I think it's like completely changing the way we think about engineering, right? Because you can start like a task locally upload it to your teammate in the cloud to just take care of it. — That's really magical. — Exactly. And so this is going in the cloud. It's going to include the changes we just had locally, but we can come back to it later. So we can stash our changes or even throw them away and bring them back from the remote tasks later if we want. — Amazing. So this was a very like simple task that you showed us. I'd like to see

like Codeex take some like initiatives in terms of the design direction or the I don't know like features or layout of the app. — So what I'm going to do now is I'm going to change my IDE settings to run it in the cloud. — Yep. — And this time this is going to be a new task. I don't need it to use my local changes or IDE context, but I'm going to ask it to add a button to the header to make a really interesting thing, something fun. It's like not just like dark mode, something more interesting than that. And next to it, I can tell Codeex how many times I want it to attempt this task. So, you just gave those instructions and Codeex Cloud is going to work separately four different times with maybe coming up with four different opportunities to solve that problem. — Exactly. I mean, it's pretty amazing to watch Codeex work. Every single attempt is going to be a little bit different. In fact, we even have Codeex currently working on the hover states and the theme at the same time. I could even have another conversation going locally if I wanted.

— I'm curious, by the way, in your own personal experience, like how has that changed your workflow? — It's a good question. Um, back when we were launching Codex Web, it was like 1:30 in the morning and we were trying to get this really fun Lahi animation to animate whenever you submit a new conversation in Codex. Um, and it worked perfectly locally, but when we pushed it into production, all of the Lah animations except for this one wouldn't work. So, we asked Codex to attempt it four times. Three of them did not work, but one of them figured out this very obscure content security policy issue that was preventing some inline JavaScript that happens to be in that one animation from working and it saved that aspect of the launch. — That's incredible. So I guess for like very nasty or complex like bugs or like you know things that you're kind of like struggling to find out, this is exactly the kind of thing that Codex can take a look at. — Exactly. — Like even like look at it from different angles, try different perspectives. — Exactly. And I I'll use it for planning, even planning or working on a complicated refactor where I don't even know exactly what I want, but I'll have Codeex take multiple attempts. And sometimes I'll take the best aspects of each one. That's really cool. So, what's going on now with those four tasks? — Okay, let's take a look at this. So, we

have attempt number one. I'm just going to go ahead and apply it. See what happens. And go over to the browser. And you can see — Oh, wow. — Oh my gosh. — That's very, very good actually. Very creative. Okay. — I've never seen that before. the same. Let's see what else it did. — Let's take a look at the next one. — So, I'm going to revert that one and then I'm going to apply attempt number two. — Oh, yeah. The entire theme has already changed. Interesting. Okay. — Uh let's take a look at the next one. — Wa. That's pretty cool. I'm guessing like conversely to what we did right before, now you can take any of these cloud tasks, check them out locally, and keep working locally in your code editor. — Exactly. — That's very magical. Gabriel, before we wrap, like can you check on the status of that task that you sent at the beginning that you started locally and then like offloaded to Codexcloud? — Looks like it's done. If I open up the hover state task that we kicked off, I can see now that it's modified a few additional files. And if I apply the changes locally and then go to the browser, you'll see that it added hover states for a couple new items. The start building button now has a slight hover state as well as the switch in the top right corner. — Amazing. Thanks, Gabriel. Well, we hope this gave you a quick tour of how you can use codeex directly in your code editor now with the extension. It's all included in your Chad GPT subscription. In order to download the extension, you can go to opener. com/codex or simply look for codeex in your extension marketplace. With that, thank you and we can't wait to see what you build.