Play by Play is a series in which top technologists work through a problem in real time, unrehearsed, and unscripted. In this course, Play by Play: Visual Studio Code Can Do That, Burke Holland and John Papa explore their favorite features and extensions for Visual Studio Code. Learn how to customize VS Code, maximize productivity, along with debugging and deployment. By the end of this course, you'll have a deep understanding of how to use Visual Studio Code and kick your productivity level up to 11.
Course Overview Hi I'm John Papa, and welcome to this Play by Play on VS Code Can Do That. Or VS Code Can Do That? Can Do That. Yeah. So do you want some tips that are going to make you a much more effective and efficient developer writing your code? I assume yes is the answer. So in this Play by Play, myself and --- Burke Holland. --- we're going to walk you through some of our favorite features inside VS code, including some of the extensions. Yeah, and even if you're an avid VS Code user or you've never used it at all, this Play by Play's going to show you how to turn your productivity up to 11. Oh yeah, I like that. So we hope that you enjoy this opportunity to get started quickly and effectively with VS Code.
Customizing VS Code Hi, I'm John Papa, and I'm a web developer with Microsoft. And I'm Burke Holland, and I'm also a web developer with Microsoft. And today, we wanted to get together to share with you some cool things that we've learned about VS Code in a session called VS Code Can Do That. So Burke, first of all, what is VS Code and why'd you get into this? So VS Code is an open-source text editor from Microsoft, so it's cross-platform, runs on Windows, and it runs on Mac. And I had started using VS Code, and I became fascinated with all of the things that VS Code could do. And it's become super popular, and there's a good reason for that because it can do a lot. And so I started learning all of these tricks, and I thought man, VS Code can do that. That's kind of crazy. It's pretty cool. And going back, going back in the way back machine now, a couple of years ago when it first came out, one of the reasons I got into VS Code is I was bouncing around searching for my favorite editor. I was using Sublime, and Brackets at the time was a thing, Vim, I even tried that for a bit, TextMate, WebStorm, Visual Studio, IntelliJ, all these different options that were out there. And I heard about VS Code and wanted to try it, and the thing I really, really needed to have for me was, like everybody's got their personal favorites, I needed speed. It had to open fast and be fast. Nothing's worse than when you're using an editor and you're waiting for letters to type or things to open. The second feature was I really am keyboard heavy. I wanted to not have to touch my mouse, I didn't want to go to menus, I wanted to be able to use my own keystrokes to drive around, and I found that to be the case with VS Code. Yeah, it's a phenomenal editor, it's great with keyboard shortcuts, and it's great if you're coming from other editors where you sort of become used to those keyboard shortcuts. There's a lot of that stuff --- And we're going to show some of that, right? --- that's very, very similar. Yeah, we are.
Maximizing Productivity I do something slightly different, and this is kind of just how do you want to roll? I'll show this over here on my machine. In my machine if I change something, like let's say I've got the fontSize set to 16 right now. I'll change that to, I don't know, 32. When I do that, it automatically will change within like a second. Can you see that? That's really big, so let's go back to 16 in there. What's happening there for me is I have autoSave turned on. Oh, look at that. So you didn't even save. You just typed, and then it saved. Exactly. And to do that, you can go to File and check Auto Save. What that actually does is if you look down here for it, you can see files. autoSave. I like to alphabetize mine. You can see it's afterDelay, and I have a --- So you're manually alphabetizing your saves. I manually alphabetize my saves. You're very organized. Yes, I am. I'm kind of like that. So I kind of go through there. Let's say you didn't know where that was though. Let's scroll to the top when you're looking for it. If you go up to the search settings, I can type in AUTO like this, SAVE, and you can see the setting over on the left. If you hit the Edit button, notice it automatically found it on the right. Oh, that's nice. And you can change the settings right here, so you don't have to remember what they were. So just to give an idea, let's say I changed this manually to off, and now I come back over here. When I select this to afterDelay, it'll automatically change it for me. I've got ya. And then have an autoSaveDelay of looks like 1000ms, so sort of a 1-second delay. Right, because you wouldn't want it saving as you type because that might get a little bit annoying. It gives me just enough. I usually go somewhere between 500 and 1000 just because it gives me a little bit of time to do stuff.