30 VSCode Keyboard Shortcuts You NEED to Know

today I'm going to take you through 30 keyboard shortcuts in vs code that are going to help you navigate vs code more efficiently and edit code much faster I use these all the time myself knowing of keyboard shortcuts really helps increase your productivity not just software development for example if you do video editing and Final Cut Pro using keyword shortcuts make you work way faster because you don't have to switch between the keyword and mouse all the time since software development is text focused knowing the important shortcuts really is the game changer next to the shortcuts I'll go over in this video I use a Vim extension this introduces a whole new set of shortcuts and commands I still pretty much consider myself a Vim Noob so I'm not going to cover film commands today but I'll focus on vs gold keyboard shortcuts before we start I have something for you it's a free code diagnosis Workshop where I teach you the most important things to look for when you want to quickly identify problems in your code it's based on your own experience reviewing a lot of code and trying to do that efficiently while still finding the problems fast you can sign up for the workshop at iron.code diagnosis contains lots of practical advice I'm going to show you examples from actual production code of well-known python packages that you might actually use so Ironwood code slash diagnosis the link is also in description of this video I'm going to start by showing you a couple of General shortcuts now I'm using a Mac but I'm going to display both Windows and Mac shortcuts on the screen for each singing right show and also I'm going to use the the normative ordering of each of these things so for Windows this is Ctrl alt shift and for Mac this is Ctrl option shift command first thing I'll show you is opening a new window on Windows this is Ctrl shift and on Mac this is shift command and so there we go very easy and you are ready to go the next command is zooming in and zooming out and on Windows this is control plus equals or minus sign and I'll mark its commands plus equals or minus sign so it's equal you zoom in like so and with minus you zoom out and normally I generally show my screen in my videos pretty much zoomed in so that you can actually view the code more clearly but when I work on code myself that's not being recorded for YouTube then I generally make this a bit smaller so I have a bit more room on the screen next I'll go through a few shortcuts to help you show or hide certain elements on the screen so it's a bit easier to organize how you're working for example showing or hiding the terminal is done by Control Plus backtech so you can just very easily show or hide this thing it's really useful there's also the sidebar that you see here if you want to show a hide that that's control plus b or commands plus b so if you want to make your code window a bit larger you simply press command B Ctrl B and then you're ready to go what's also useful if for example you are here in the extension screen and you want to go back to the Explorer view you simply press shift command e for mac and for Windows that's Control Plus shift e and then you go back to the Explorer view so you can quickly show the files and then it's also in Focus so you can just move around here with the arrow keys another thing you might want to shift to find and that's shift command F on the Mac and Ctrl shift F on Windows and then you can start searching for something and that's going to look for things in multiple files all the files in your workspace in principle you can also go to the source control section on Windows that's Ctrl shift G and on Mac annoyingly it's not shift commands G like the other ones it's Ctrl shift G and then we go to Source control because actually shift command Z that points to another shortcut if you want to show the extensions that's on Windows control shift X and on Max shift command X like so so this allows to easily navigate between these areas on the left and then if you want to disable that again command b or Ctrl B on Windows another thing that's nice in vs code is Zen mode so if you just want to focus on editing you don't want to have all these user interface elements surrounding you on Windows you can press Ctrl k z on on Mac it's command okay is that now that's probably going to cut off part of the recording but in principle this switch is now to the full screen view if you want to go out of Zen mode again press Ctrl KZ or on Mac command KZ like so final very useful shortcut is to view the command palettes on Windows that's Ctrl shift B and mac its shift command like so and then here you can simply type to search for things for example if I want to do some work on markdown then I can simply type markdown then I'm going to get the commands that I can run on markdown code and press escape to go back to the editor so those were 10 more General shortcuts to help you navigate vs code a bit faster now I also want to show you a few shortcuts to help you navigate files faster particular opening and saving files and opening and closing edits of windows so the first one if you want to quickly open a file on Windows that's Ctrl p and we'll make it command p and then you're getting a similar view like the command palette but now you can actually search files by name for example if I want to look for the helper.pi file this is what I have here I simply type help in this case which directs me to helper.pi and I press enter and now it's going to open this file file for me so that's really nice now if you're editing a file for example let me insert some text here hi this is a comment and then when you want to save this on Windows you probably know this one it's Ctrl s on your Mac it's commands like so let me add a few more empty lines here and if I move to this tab and I can also add a couple of lines here now I have multiple edited files if you want to save everything on Windows that's Ctrl k s and on Mac it's option command s so now it's going to save all the files which is also really helpful there's also a couple of useful shortcuts to help us navigate through the files more easily for example if you want to move to the top or the bottom of the file on Windows this is Control Plus home or end and on Mac it's commands up or down so you see we go from the top to the bottom that's very useful another thing you might want to do is find something in the current file Windows that's Ctrl F and on Mac commodif you probably also already know this one so now I can type something here like for example base 64 which is being used in a couple of places in the files and then I can press enter and it simply is going to go through each of these options and that happens in a round robin fashion what is around Robin that means that when you are at the end like I'm not six out of six and I press enter again I'm going back to the first one again and if you press shift enter you go back in Reverse fashion and that's also reverse round robin so if you are at the first one and you press shift enter again you go back to the last one so this is very useful to quickly navigate your find results there's also other shortcuts for this on Windows you can also do F3 or shift F3 and on Mac you can also do command G or shift command T that also works next is shortcut for the peak editor so if you put your cursor on one of the let's say variables or class names in your code file like here for example I have sender what you can do is press shift F12 both Windows and Mac and then this is what it's going to show you so you see that it shows you where it's been used on the right you have all the references and with the arrow keys you can navigate between them and see where that variable or where that class is being used in the code it's another example I have class iot service so when I press shift F12 it's going to open the peak editor but you see that it's being used in different files so this is an iot croissant but if we go Auto controller I can press enter to open this then we can also see it being used here and same here for the surface so if you open this you see that the class is actually defined here so if you want to open this file in a new tab you simply press enter and then you go to that specific location in the file in a new tab so now you can start editing this file if you want to it's really useful there's also a more direct way to do that if you want to go directly to the definition of this thing the iot service in this case you simply press F12 and you are taken there that's also very useful you see that I have a couple of tabs open now there's also a really easy way to navigate between them on Windows you can press control page up or page down to navigate between the tabs and on Mac it's option command left or right arrow and you see I can very easily quickly navigate between the tabs and also this is round robin and reverse round proven so that's also really nice I like things that are round robin they should make everything round robin if you're on top and you want to close the top that's also very easy on Windows it's Ctrl W in our Mac it's command W and that simply closes the tab if you do Ctrl K plus W or command K plus W it closes all the tabs so let me can go to the Explorer with shift command e on Mac and Ctrl shift e on Windows and now let me open this markdown file that I have I'm going to close the left side with command B Ctrl B on Windows and now we have a markdown file here this by the way is an outline of one of my recent videos on facade pattern if you want to watch that video I've put a link at the top but what's really nice is that vs code has a way of previewing what the markdown is going to look like when you render it and that's really useful for example here I have mermaid diagram and I'm using an extension here called this markdown preview mermaid support and that's actually able to render mermaid diagrams directly in vs code so that's really nice anyway back to my markdown outline let me close this and now if you want to show preview on Windows this is Ctrl shift V and on Mac it's shift command V like so and now we have a preview so you see it even renders the diagram nicely here let me close this command W and then if you want to show the markdown to the side and not in a new tab this is also possible with a shortcut on Windows this is Ctrl k v and on Mac it's command k v and this is going to show the preview on the side which is really useful as well and what I really like about this is that actually when you scroll through the preview it actually updates the scroll bar here as well and vice versa so it's really easy to have this View and edit your markdown files in this way so let me close this preview again and I'm going to open the iot facade file here we go now let's go through a few text editing shortcuts like I mentioned before I use Vim in vs code that's actually an extension that I've installed that's the Vim emulation for vs code which I think works really well but next to Vim you also have a couple of shortcuts in vs code that I think are really helpful so use kind of a combination of Vim commands and vs gold shortcuts to get the job done let me close the site now again come on B the first thing that's nice is the multi-select cursor like for example here I have the cursor on the word self so if I go into edit mode and Vim and now I press command D on the Mac or Ctrl D on Windows I can now edit all the occurrences of Self in the same way so for example here if I edit this you see it's going to change this directly which sometimes is really helpful I have to be honest I really don't use this that much what I do use a lot is that if I want to change the name of a variable I put the cursor on the variable and then I can press f2 both Windows and Mac and I can change the name of that variable for example if I want to change the name here to Smart speaker two whatever name doesn't matter and then it's going to update it everywhere really useful let me change that back a very useful shortcut is being able to move the lines up or down on Windows you do that without up down and on Mac it's option of down so if I'm on this line for example I press option up now the line is going to move one up and I can move it down again as well so really useful I use this a lot because often in coding you have to swap lines or move things to a different function or whatever and then this is really useful also you may have to write a couple of lines that are very similar so then you can actually make a copy of a line very simply by doing alt shift up or down on Windows or option shift up down on Mac so for example if I do option shift up then it's going to make a copy and it's going to put the cursor on the line on the top and now you can start editing this line let me delete that again another thing that's really nice is that you want to be able to comment on lines of code on Windows this is control slash and on Mac it's command slash so you can very easily comment and on comments lines of code there's also a block version if you have a block of commands you can use alt shift a on Windows and on Market shift option A finally what's really useful is a quick way of opening the settings of vs code on Mac this is command comma or window this is control comma so we get this this is the settings space and you can pick whether you want the user or the workspace or the folder settings you can change all those things I often also directly edit the Json file which contains the settings so you simply click on this button and then this is the Json file there's some old stuff in here that I probably need to clean up a bit but this is a very easy way to just go through the settings that you have and change things when needed and gives you a very nice overview and the final shortcut I want to show you is the shortcut to show what the shortcuts are so Windows that's Ctrl K Ctrl s and on Mac it's command K command s and now you can see all the key bindings shortcuts in vs code you can also search things here for example if I type close window I'm going to get the key bindings for closing Windows now small bonus tip for you let me make the window here a bit smaller so you can see what's actually going on so you see that the top of my window has a non-standard color and this is actually something that I do in a lot of my projects this is actually something you can easily change in your settings so what I do is that for each workspace I put in this little piece of code and then I pick a color here so you can click on this color and then you can simply change it to something else for example let's say we want to have this green color so now when I save this then you see we're going to get a really ugly green color with command Z I want to undo that because I really don't like that so there we go back to the RM codes color but this is actually really helpful because if you change the color for each of your workspaces and you have multiple windows open it's very easy to quickly see in which workspace you're currently by simply looking at the color of the title bar so it's for me that works really well today I covered only 30 keyword shortcuts and fierce code but of course there are way more that you might find useful so I've put links to the files with these keyboard shortcuts for both Windows and Mac in the video description if you are using a Mac for software development you might also be interested in this video where I take you through how I set up my Mac and how I change the settings and which apps I installed in order to optimize the Mac for software development I'm done the work is done I recorded three videos today three foreign coffee oh much better I love coffee I think I drank way too much coffee actually that's well I don't care living on the edge you know ah it feels so good you know when you get older it starts making noise it's like it still feels so good though unless you take it too far don't take it too far you have seen an older person working like like this it's because they took her too far so you know at the end of each video basically if you look at my percentage of viewers that's like oh so everybody's basically leaving you know once you get your the thing that you were looking for and where you live makes a lot of sense right not you you're still here I mean for the past minute or so there's been like zero useful information and you're still here watching this it's your tenacious I respect that we do so I think I'm gonna turn off the lights then this bad boy is going home because it's weekend I'm gonna go nuts no just kidding I probably should have gone gone to sleep I don't know anyway thanks for watching and see you next week

Channel: ArjanCodes

Views: 56,250

Keywords: vscode shortcuts, best shortcuts for vscode, shortcuts for vscode, vscode python shortcuts, handy windows shortcuts, handy shortcuts for windows 10, mac shortcuts, mac shortcut keys, mac shortcuts tutorial, mac shortcuts for windows users, mac shortcuts for beginners, mac shortcuts you need to know, mac shortcuts 2022, mac shortcuts 2021, vscode tips and tricks, vs code shortcuts, visual studio code, vscode keyboard shortcuts, visual studio code extensions, vim tools

Id: dI34jrEtmB0

Length: 17min 15sec (1035 seconds)

Published: Fri Dec 23 2022