Transcription
Hello. How's it going?
How's it going? Very good. My name is Oswaldo and I am Josh. Uh we are are on the VS Code team. Uh we are both engineers and we've been working on a lot of agents work over the past couple of months. Lots of agentic flows and uh chat experiences and stuff like that.
But Josh, yes. Imagine I've downloaded VS Code today. Sure. I have no idea what it is. Okay. But I don't let it because somebody told me agentic flows and agentic experiences are really really good. Sure. What is agentic flow? What is what are those agentic experiences?
Yeah. I mean I feel like it's what everyone's talking about these days. It's what this whole um you know I think for the past few months it's what we've been focused on. Uh so agents I think the best way that I think of it is it is a way uh for code or for um I guess the editor to write code on your behalf. um for ways that you can get work done faster um and stay in the flow doing the work that you care most about which I think is the most powerful thing um that we are offering.
I agree with that. [laughter] And so um the past probably this year, the whole year we've been working a lot on these uh experiences and uh we're excited to show you um something that we just uh launched recently and so we can show you here.
Yeah. So Haldo is going to show um a bit of work on an app he's been building called Spokes um which is I guess maybe you want to explain it.
Yeah. Uh so this is an app that I've been working uh on for just bike rides and being able to talk to people while you're bike like doing a bike ride which is fundamental if you're if you like listening to music.
Um but I want to show you here uh this is my app. Imagine I just uh clone the code. I have no idea how to run it. And then you can go here and say um compile this app and launch it uh in a simulator, right? And so you can see here all this new um UI where you can uh track all your agentic flows um all of the sessions that you have open and be able to do multitasking here, right? Um this is it went a lot of work into this. Uh our team in Zurich was really helpful in this. Um so you can see in in this session um it actually prompt me if I wanted to run this particular uh tool and so we go ahead and and select it and then let's see in the meantime we explore this code a little bit uh we can say um read the configuration and tell me what else I can add there for this app. Right. This is as I said an app that I've worked on for a while and by worked on I mean Vive coded for a long time and um so this is something that you can imagine you are building your own project you are want to add more features. There's a lot of things to do when you start a new project, right? And so you execute and execute and execute and just like keep um coordinating your agents here, right? Uh it keeps prompting me to uh if I want to run these particular commands and stuff like that. And then boom. Hopefully it will work. Let's see what happens. Allow. Um
yeah, and you are running this inside of our local agent, right? We're running this inside of a local agent, but we know everybody works differently. Everybody likes to do things in a different way. Um, so let me show you a little something about um another way for people to be able to to execute these um agent flows. And so we have these options for creating, for example, let's do a background agent. And what this is going to do, let's say that I want to add to my configuration, um, you know, I'm from Mexico. In Mexico, we don't use miles. And so this app, when I vive coded it, they just automatically decided to use miles, right? Which is hard for me. So let's try to see u can you add a setting that um allows users to switch between imperial and uh metric system. And so you can see here we decided to do it in a work tree which what it does it will create a work tree for you so that it doesn't mess with anything inside your current workspace. So you can have all of this work going in the background and decide when you want to apply it when you want to uh use it in your in your current workspace. Um, so let's go back here. See allow. Um [clears throat] perfect. The app is installed and let's see if it launches the app. There you go. Pretty sweet.
So, this is all my rights, um, my profile, friends. You can see I don't have many friends. My settings, and this is where we want to add this particular setting, right? Like we want to be able to to do um a different uh metric the metric system versus imperial. Um, it shows here all the changes that it's been doing which is really cool. Uh you can decide to keep them undo them. It's actually creating a unit service. Really nice. So that we can apply the changes as we go. So yeah. So at at this point you have an app you didn't even know how it worked perhaps. Uh you opened up uh the project in VS Code and you explained in natural language what you wanted uh to accomplish and yeah we saw it here on camera. um is working on the solution and um even inside of VS Code with MCPs and other tools um you know this is a Swift app an iOS app um but with MCP tools which um I I love using um you're able to uh build and run test um see in the simulator all of um all of the changes that that you're doing. Um, so it's all kind of integrated in one spot and all uh controlled do natural language which I think is super cool.
Really cool. It would have take me months to do this and it was really fast. And so now with this view and being able to like um [clears throat] being able to coordinate your changes and like being able to coordinate the features that you want to do um all these kind of things uh makes it even faster to do.
Totally. But Josh, why don't you show us how to be able to delegate this? Uh
yeah, sure. Um so I can uh show So I'm I'm working on another iOS app. Um one that I've been um playing around with for a while. I show a little bit of it in the background. I've showed this in previous live streams. Um it's like a kind of like a hide-and-seek game essentially. Um where you use the entire transit the entire kind of transit system of a city um and play hide-and-seek. This is like the idea of the app. um kind of based on a game um that is on YouTube. Um so what I wanted to do was kind of create an app that made it easy for me to beat my friends in this game. So uh we have all these tools um that allow you to kind of narrow down where someone's hiding in a city, say um and this is of course Seattle where we are right now. Um, but I wanted to add some more features. So um I have a bunch of ideas here. I've actually closed quite a bit of them um from before, but I want to add a new tool that tells me um from the clues that I get if the person hiding is like north, south, east or west of me. And uh you know, this is something that I asked plan mode here. So, we have this new option in VS Code. I think it was last release. Uh we shipped plan mode. Um so, right here in VS Code, you can see all of my previous sessions on the side here. Maybe I'll hide them for now. Um, but you can see I just asked and I'll scroll up to the top. Um, I just said, you know, let's work on this issue. Um, which I have some information in that GitHub issue. Uh, so what it did is it ran a sub agent and it grabbed the issue details from the web uh from from from the issue because I'm signed in uh to GitHub in VS Code. It was able to fetch this information and then it was able to synthesize um, you know, what I actually wanted to accomplish in that issue. It read a bunch of files in the project. Um, it we'll see down below here that it actually created this plan for me. Um, which of course is exactly what I wanted to do. Um, it understood that um we have tools um in this project. There's a protocol that all of um these tools conform to. Um, and it found some of the other tools that already exist and found how they're registered. So it gave me as the human a nice summary of uh exactly what it will do kind of step by step. You even see it here step by step kind of numbered one through five which I find really cool as a developer who you know might not know what the agent is going to attempt to do. Um, so it's really cool that uh we have plan mode fully integrated into VS Code now.
I think that's been helpful. I think it's really interesting like what you bring up with like the being able to plan your workflow and being able to plan what you want to do >> because you've heard a lot of like people >> doing a oneshot >> situation and then you just like do this thing and then you have it clear in your mind and you're like oh the agent didn't do the thing that I wanted to do. Right. Right. Totally.
And so I think this is a really cool strategy to to know for sure give like a specific structure of what you want to >> and the agent to do. Right. Right. Totally.
Yeah. And set it up for success that way.
Right. And I think this has been super helpful with, you know, when we've been working on VS Code, at least for me, when I'm working on a feature that is new to like a new area of the product, um, that I've never touched before, um, not super familiar with, I'll use plan mode. I'll explain there is normally get issue either from the community or from our team internally uh that explains uh what we want to accomplish in it and I'll let plan mode explain it back to me ask it for code pointers you know references um how the agent would accomplish it and there are sometimes where the agent can go the entire way there are sometimes where I I wanted to start the implementation and then I'll go in and uh make changes myself um but that's I think what's really cool about the 107 release the one we released yesterday, I believe, um is that we have all these agents and all these tools that work in like I think like different degrees of autonomy, right? There's there's some that really help the developer um get context and information and get going and then there's some that some tools that we now offer that are built into VS Code that allow complete autonomy. And for a hobby app like the ones that we're showing here, uh it's kind of fun to just throw down an idea in a GitHub issue um say go ahead try it and then come back an hour later. And with these apps with TestFlight, it can be pushed directly to my phone. I don't even need to be at my computer. Um, I just say go ahead do it and then you see the code change on your phone an hour later. So um super cool. I have really been enjoying plan mode. I also really enjoy these uh considerations that uh we tell plan mode because all of these are prompts behind the scenes um essentially and you can see I have some custom agents here as well. But this is a an agent with a custom prompt that um is really good at kind of digging deep and then also surfacing these questions that um are good to think about ahead of time and not allow the agent to loop for 20 minutes and and be like, "Oh shoot, I should have thought >> uh about this consideration." and you know like this and be relative to this or that.
Also the other way around, right? Like sometimes if you do like the oneshot thing and then it just goes ahead and implements something super complex and you're like you didn't you didn't have to go all the way there.
Um, so it's kind of nice to be able to be actually this is a good idea, this is a bad idea and make sure to think about this other thing, right? Which is really nice.
Totally. And a lot of the work that we've done this month, this past iteration, is that we have this uh new button here which had existed in other forms in the past and now we've kind of consolidated um it to this continue in feature here. So um let's say I mean I've kind of already looked through this uh plan. It's using my instruction files. Um it is kind of going in the right direction I think from what I understand um about about the app. Kind of assuming that I haven't written a lot of it. AI has written a lot of it. Um, so that looks great. Let's, and I wanted to answer this followup. Let's use uh area uh let's use directional callouts here. So just kind of answering their question here. And let's say you know the like the thing that I find most useful about this is that um we now have some more options of how we want this conversation to be continued. There's a big argument for or like there's a lot of use cases where I just want to stay in my editor here and I want to watch uh you know what the agent does. I can stop the agent and I can go in and make code changes whenever I want. And there's sometimes where like say I am heading off to lunch or something and I think that agent has a good grasp of this. I can say continue in the cloud. Um, which um and then I can delegate it which what it's going to do here is you can see it's analyzing the chat history. So it's reading everything that we have here and it's compacting it down into something that um like a single artifact um that can be used by the cloud agent and the cloud agent is the copilot coding agent um that runs in GitHub. Um, so you can see it is delegating to this cloud agent. It's creating this pull request and you see here it closed uh this chat because now it has been delegated to the cloud. And we can pop into it if we'd like up at the top here. Uh, but you see it says cloud at the very top instead of um uh instead of local because we're not local anymore. We are in the cloud. And you can see here that it has started the pull request. When it starts working, it'll start streaming in um all logs and information from that um change. Um, you can see this was my prompt. This was the summary of the task that I wanted it to complete. And you know uh if we want to get more info here, we can see um see the pull request. Actually, we can even go um right to my repo here and we'll see um that it has started uh the feature and then once it starts working uh you'll see it start working here and start streaming into VS Code.
very cool.
So yeah, this is kind of the flow that I use a lot of the time. um if I want to get a kind of a fast prototype like you'll see on VS Code if you look at all of my work on the VS Code repo um you'll see a lot of ideas um that I send to the cloud and I see kind of what it comes up with and I use that as a starting point for either discussions for prototypes um for um yeah for really all the work that we do I think there's a lot of value um in um being able to get some some kind of code example you know working really quickly
yeah, and also a lot of value on like providing all these options for people that if people want to use background, if people want to use cloud, if people want to use local.
Totally.
So everybody works differently and there's there's a flavor for everybody.
Yeah. And you can even see here that we have this running in the background. Um, but we can start kind of other um tasks here and um they run autonomously. I did want to kind of highlight the custom agents as well too because I think this is a pretty cool feature that we have um where I wrote this feature or I wrote this um super simple custom agent um which uses these features um uh in in this case here it will specifically like explain explain mapkit right I think this is a great example of agents um kind of working in ways that aren't just writing code um but are actually helping you work smarter and faster, right? Um, so in this case um it's going to use this MCP server which I had open at the beginning um this MCP server called Apple developer docs. Uh you'll see uh it's going to ask if it's allowed to use this um which is great. Um, we don't want we always want I think the developer to kind of know what's going on. Yeah. Um, so we have we have spent a lot of time uh and effort um in thinking about how um you give your consent to agents and how um how that works and like the UX in VS Code and I think spent a lot of time talking about that. Um, so I love that. Uh, you can see here it is using this MCP server. It's going to um go to the Apple developer docs site um and try and understand um, you know, you know based on my question what docs are most relevant and it's going to do uh like it's going to go and find docs from different sources and kind of kind of connect that uh all the pieces together for me essentially um, which I don't know if anyone on the stream has used the Apple developer doc site um, but it is at least for me. Not the friendliest uh site um to use. I feel like I get overwhelmed really quickly and there's links to going into all sorts of stuff. There's examples here, but um that's why I built this MCP server because I I wanted um a really quick way to understand if I'm using APIs correctly, if they're deprecated. Um, and here um, you can see the resources. I know we have another talk later on MCP, which I think will be pretty cool. Um, but just a little sneak peek of how um how it kind of connects the dots for you here. Um, and I use this extensively and I let the agent use this extensively when I was first building this app out so that it used these best best practices um from Apple instead of, you know, attempting to use APIs that it saw in its training data 5 years ago that are no longer supported by Apple.
yeah, and I've used your MCP which is really cool. Um, he helped me a lot, too. Um, let's see the the work on this on the that we started in the app the initial app is finished. Okay.
Should we give it a try and see what happen?
Okay. Yeah. Let's go back to your screen and take a peek.
Uh, so you can see here it finished all the work. It created all these files modified all these files so we can keep them. U you can see 217 lines of code which is nice amazing like in what the time that we've been here. Uh really cool. Then we can apply the changes and then immediately get them to your workspace, right? It's it's all of the changes are here already. So let's go back to or we can create a new session. This is the beauty of being able to like track all of them, right? And be able to like uh create multiple um you're able to archive also so they'll go away and then you keep this clean um which is really cool. Uh, so let's say uh build the app and lounge in simulator. Let's see what it did. Um, I want to also show how you can also create um codeex agents from here from from this same view. So it's kind of like a centralized uh view right to to manage everything. And so we had initially I don't know if you remember the you remember the initial view how it looked like in the editor and like how um we had this separate view now we have decided to move everything into chat like everything related to AI is in chat right? And so which we heard people we heard the feedback and we are um we want to improve we want to make things better and we want to make sure that people are uh able to do their work um as they want. Right? So, this new view, you're able to customize it. Um, you can see here I have it on the left side. I like it that way. That's my preference. But you can also have it here or you can hide it if you want. You can uh decide if you want to stack it side by side. Um, you can modify as you wish. If there's one thing that we're missing, let us know and we'll we love feedback, you know. Uh, so this is running. Looks like it decided to change to a different simulator, which is, you know, maybe making sure that it works for every single iPhone.
That's smart. Smart.
Let's see what it does. Complete your profile. Um, I'm going to name myself Josh. How about that?
Sounds great.
Josh. Josh.
Excellent. And And I have an account on the app.
There you go. Yeah, now we have two.
This is how I sign you up.
Yeah. [laughter]
So,
I'll deploy.
Cool. We have this new setting here, which is the units. We wanted metric or imperial, which is really nice. Let's see what happens here. If we go There you go. kilometers. Kilometers per hour. That's really nice.
Very cool.
And easy.
I didn't have to write any code.
Yeah, exactly. This is really nice. Uh, so let's say we finish with this um work here and then we can just archive the session and just keep it clean and and and think about what what to build next.
Cool. And uh, yeah, let's see what else have we I mean we've added so much this this this month that I feel like we're missing like so many things. We um I mean I guess like the big thing is that um you can create you know a new session uh in the chat and you can hop between them. These these these chats even local chats now are run in the background which I think is a huge change to VS Code. Anyone that's used agent mode uh in the past uh you know knows that if you wanted to start a different local session you would need to stop your current session. That's no longer the case. you can track them all from the view um that is integrated into chat which um I think is huge. I think that's that's kind of one of the underrated features I think of this release. Um huge kind of architectural change that our team did um to allow that to happen and kind of really align a local chat which can run in the background with um the other kinds of modalities of agents that that you know run in the cloud run isolated work trees.
so when you say running the background like a local chat.
Yeah. Right.
But also there's background chats that run like with a work. Can you explain?
Yeah, sure. Yeah. So um yeah, by background I mean um you can run two chats that um are either looking at the same codebase um like your local workspace at the same time. um if they are working on isolated features, you could have them work on two separate parts of the codebase and that's all local um with the same agent that you've been using for a year, two years now.
and work tree.
Yeah. And then what we call background in VS Code um with the continue on flow um is even more isolated, right? In the sense that it uses a work tree. So that's um like a function of git um where you can um tell git to create a whole different directory um with your code and it'll operate on that code um which means that you can run three different you know like background agents um on your machine and they'll run on three different copies of the codebase. So that means they won't step on each other essentially. And then lastly, of course, we have cloud, which I showed, which is also quite similar, but it will push your chat context up uh to GitHub and they will run that on their infrastructure. So, you can, you know, you don't need your laptop running, you can just close your laptop um and then you can come back later and you can see all the work that the cloud agent did there. very powerful, very excited about all these new features. And um please let us know, use it, let us know what you think, um what you like, what you don't like. Um, we like to hear that too. Um, and yeah, thank you. Thanks.