Use the mouse less (when you can) 🖱️
Kebyboard shortcuts are amazing (and they'll be covered a bit later) but you can do a lot with built-in commands via the command palette (⌘ + shift + p
). If you're not sure what to do, open the command palette, start typing and see what pops up! There's a huge number of default commands and most extensions will typically add functionality to the command palette. The amount of power at your fingertips is awesome!
The right place for the navbar... 👉
Moving the navbar to the right means your text won't jump around when you toggle the navbar. A really simple quality of life improvement that (after a little getting used to...) is well worth doing!
Simply update your user settings json file (⌘ + shift + p
then user settings JSON
) with the following:
"workbench.sideBar.location": "right"
Custom code snippets
There are a lot of VSCode extensions that come with linting, formatting and (often) code snippets. These code snippets can be super helpful, but they aren't customizable. Instead, you can create your own custom code snippets within VSCode.
Simply open the command palette (cmd + shift +p
), enter snippets
and select the Snippets: Configure User Snippetsf
option. Snippets are bespoke to the language being used, so choose a language and then update the JSON with a payload following the below template:
"shortcut-name": {
"prefix": "XXX",
"body": ["typing XXX will result in THIS text snippet being inserted"],
"description": "some helpful text"
}
A simple python example for populating an if __name__ == "__main__":
block using the shortcut inm
would be...
"if name is main block": {
"prefix": "inm",
"body": [
"if __name__ == \"__main__\":",
"\t$0"
],
"description": "Inserts if __name__ == \"__main__\": block"
},
Custom shortcuts
Keyboard shortcuts make your life 100x easier!! VSCode comes with a HUGE array of actions and many of them have shortcuts. If an action doesn't have a shortcut open the keyboard shortcuts section (using the command palette's Preferences: Open Keyboard Shortcuts
command) and update your keyboard action with a new keyboard shortcut. Often your shortcut will already be linked to an action (that is often obscure and of no use to you). Simply remove the existing keybindings and add your own (being careful not to remove a keyboard shortcut you might use in the future!)
A great example was re-mapping the cmd + 1
and cmd + 2
shortcut to navigate between tabs (rather than navigating between split windows, which i very rarely use). This replicates the behaviour in my online browsers and all other applications. I simply had to remove the existing key binding and re-assign it to the tab shortcuts. Unfortunately, you have to do this for every single number. This means removing 9 mappings for keys 1-9 and assigning 9 new key mappings. This isn't the end of the world (given you can copy/paste key mappings in the Keyboard Shortcuts (JSON)
editor) and ensures you have flexibility of totally custom shortcuts.
Customized behaviour
There are some weird behaviours in VSCode that are undesirable. A notable one for me is open a new file with cmd + n
. Typically, I don't want to start editing the file straight away, making the "preview" mode quite annoying. Instead, I just want to create a blank file and type the name of the file. Luckily, VSCode allows this customisation in behaviour. You can simply remove the existing key binding (try using the Record shortcuts
function and typing cmd + n
) and replace it with a similar, but slightly different action: New file
.
Favourite shortcuts (that aren't obvious)
cmd + l
- highlight the whole line
cmd + shift + k
- delete the whole line
cmd + d
- highlight the whole word (super quick)
cmd + d
(repeatedly) - highlight all matching word results (handy substitute for simple find/replace)
option + up/down
- swap the current line up or down
option + shift + up/down
- replicate the current line (upwards or downwards)
ctrl + minus
- move to wherever you were previously (handy when navigating through code with deep inheritance patterns)
f4
when searching all files - takes you to the next result
Native navigation
Get to know your operating system. There are loads of handy navigation shortcuts you can learn that will work in your editor AND in other applications.
cmd + left/right
- go to the start/end of the line
option + left/right
- move to the next word left/right
cmd + backspace
- delete everything to the left of the cursor
option + backspace
- delete left until the start of the word
Perfecting VSCode took a while... How do I make sure I never have to do that again?
Once you have perfected your VSCode setup, I would recommend storing your config somewhere safe. You could store them on github, use a dedicated tool (like ) or just save them somewhere secure. Periodically, I export the following files:
~/Library/Application\ Support/Code/User/settings.json
~/Library/Application\ Support/Code/User/keybindings.json
~/Library/Application\ Support/Code/User/snippets/python.json
(or whatever snippet files you have created)