Advanced VS Code Shortcuts to Code Like a Wizard

Your keyboard is officially your new best friend

Random image of gandalf on his keyboard. No idea where this is from.

When you’re in the zone, you want to get the thoughts in your head into code as quickly as possible. Having to use the mouse and figure out where something is, or having to fiddle around with resizing something could be just enough to break you out of the zone sometimes.

Personally, I die a little inside every time I see a coworker reach for the mouse to move a line or change tabs. Think of your poor shoulders!

So If you find yourself spending an eternity trying to find a file or reaching for your mouse every 2 seconds, these shortcuts are for you!

If you like this one, you’ll also enjoy this:

VS Code Shortcuts To Code Like You’re Playing a Piano

1 — Move Line or Selection

Move your current selection up or down one line

• Linux / Windows: Alt + Up / Down Arrow
• Mac: Opt + Up / Down Arrow

Be like winrar and compress 4 mouse moves into 1 keyboard shortcut for moving lines.

2 — Copy Line or Selection

Duplicate your selection up or down

• Windows: Alt + Shift + Up / Down Arrow
• Linux: Ctrl + Alt + Shift + Up / Down Arrow
• Mac: Opt + Shift + Up / Down Arrow

Paid by lines of code written? I got you fam. Become the copy-paste engineer on steroids you were always meant to be.

3 — Change Tab

Go to the next or previous open tab

• Linux / Windows: Ctrl + PageUp / PageDown
• Mac: Cmd + Opt + Left / Right Arrow

That next tab is so close, yet so far. Well, not any more!

4 — Move Tab

Move current tab one position forward or backward

• Linux / Windows: Ctrl + Shift + PageUp / PageDown
• Mac: Cmd + K -> Release -> Cmd + Shift + Left / Right Arrow

For those with OCD that just NEED to have their tabs organized in a certain way (go-away-it-makes-me-feel-better gang rise).

5 — Find File

Find a file anywhere in your current editor session with fuzzy search

• Linux / Windows: Ctrl + P
• Mac: Cmd + P

You’re in the middle of coding your dream app that’s gonna win you millions and you need to open a certain file. You have a faint idea of where that pesky utils.ts file went to.

Alas, you start searching. Directory after directory, scrolling up and down, “Where IS it?! I just KNOW I had it RIGHT HERE dude!”. Hopeless. You abandon your dream app and pursue a career as a cabbage farmer.

Or just save yourself the trouble and let your buddy VS Code find it for you.

6 — Find Symbol

Find a class, function, or property anywhere in your current editor session with fuzzy search

• Linux / Windows: Ctrl + T
• Mac: Cmd + T

Best practices say you shouldn’t have 42,069 lines of code in a single file, but no one reads those so at the end of the day, we’re gonna need something special to find things. Find declarations of functions, properties, and classes in your messy scattered code base in a fraction of the time!

7 — Expand / Collapse current code block

Expand or Collapse a code block, such as a function or a class.

• Linux / Windows: Ctrl + K -> Release -> Ctrl + L
• Mac: Cmd + K -> Release -> Cmd + L

If you collapse that long if-else chain right now, you don’t have to refactor it anymore. Productivity hack 😎

8 — Collapse Code Blocks

Collapse all code blocks at a certain indentation level corresponding to pressed number

• Linux / Windows: Ctrl + K -> Release -> Ctrl + num
• Mac: Cmd + K -> Release -> Cmd + num

If the previous shortcut was a surgical strike, then this one is a carpet bomb.

Modern IDEs have so many colors in them, it’s amazing how we get anything done. Help yourself focus on your 300 line function by making all the other 300 line functions go away for a while.

9 — Expand All Code Blocks

Expand all code blocks recursively

• Linux / Windows: Ctrl + K -> Release -> Ctrl + J
• Mac: Cmd + K -> Release -> Cmd + J

If the previous shortcut was a carpet bomb, then this metaphor doesn’t make sense anymore.

Take a sip of your redbull / double espresso extra cream caramel macchiato and get ready to take on the full might of your code after this one.

10 — Switch Terminals

Go to the next or previous terminal

• Linux / Windows: Ctrl + PageUp / PageDown
• Mac: Ctrl + Cmd + Shift + 0 / 7

This one goes out to the fullstack bro/sis with 13 different services running in parallel.

11 — Switch Terminal Panels

Go to the next or previous terminal in a split-pane configuration

• Linux / Windows: Alt + Left / Right Arrow
• Mac: Cmd + Opt + Left / Right Arrow

This one goes to the rich, sophisticated fullstack bro/sis with super-max-ultra-wide displays that can run 13 parallel services and keep them in view at once.

12 — Change Terminal Panel Size

Resize your terminal section to view more or less content

• Linux: Ctrl + Shift + Left / Right Arrow
• Mac: Ctrl + Cmd + Left / Right Arrow
• Windows: Must manually assign. Lookup Terminal Resize in keyboard shortcuts.

This one helps you out when you need to see that 3 page essay of an error message in the terminal that just turned out to be you calling consol.log instead of console.log.

Conclusion

Hopefully these shortcuts will help you to stay in the zone for longer, and also save you from a shoulder ache at the end of the day. Save the mouse for browsing reddit when you should be working instead.

Got a favorite shortcut? Maybe one not mentioned here? Well don’t keep it a secret! Share it in the comments!

If you like this one, you’ll also enjoy this:

VS Code Shortcuts To Code Like You’re Playing a Piano