An Introduction to VSCode Shortcuts

Visual Studio Code is one of the most popular IDE(Integrated Development Environment)s for web development, especially for beginner coders, due to its simple yet powerful design.

For the past few weeks at the Flatiron School for software engineering, I’ve relied on VSCode to write most of my code. My first impression of the software was truly amazing — not to mention the sleek dark grey theme set as in default. But as days passed with more and more code writing that needed to be done daily, I would find myself getting frustrated with my slow workflow. Often times, I would simply stare at my code for a few hours figuring out what went wrong. Other times, however, I knew what needed to be written and what needed to be fixed, but my hands were too slow to follow.

As a current student at a business school, most of my previous work experience revolved around Excel. For quite a time, I was addicted to Excel shortcuts and the way it could improve workflow — seamlessly navigating through multiple tabs of thousands of cells, selecting exactly the cells I needed, and performing just the right functions, without touching my mouse. VSCode, just like its brothers of Microsoft Word, Excel, and Powerpoint, has shortcuts. It was only after I learned about VSCode shortcuts that code editing started to feel productive and fun.

I’ve decided to jot down a couple key shortcuts I’ve used throughout the past month that served me extremely well:

1. ⌥+↓/ ↑ Move Current Line Down or Up (Alt+ ↓/↑ for Windows)
You can often face yourself trying to rearrange the order of your code. Using ⌥↓ and ⌥↑, you’re able to quickly and efficiently move lines around without having to drag&drop or cut&paste lines of code. This shortcut also works for multiple selections of lines.

2.⌥⌘+↑/↓ Insert Cursor Above or below (Ctrl+Alt+ ↑ / ↓ for Windows)
This shortcut is extremely useful if you have repetitive lines stacked and need to edit them in the same manner. Simply insert multiple cursors above or below and make selections/edits simultaneously on multiple lines.

3. ⇧⌘L Select All Occurrences of Selection (Ctrl+Shift+L for Windows)
Renaming variables has always been a pain for me. There have been multiple times where I renamed a variable, but forgot to change its name in other lines. Locating and fixing these variable names is easy with ⇧⌘L. It automatically locates and selects all repeating occurrences of the current selection and allows you to edit them at once.

While these are the shortcuts that have served me best so far, there are many more shortcuts that VSCode offers. Shortcuts not only save you lots (and lots) of time, but they also make the code editing process more enjoyable and less frustrating for you.

Take a chance to learn about the full scope of VSCode shortcuts here.