Multi-Cursor Editing
First on our list is multi-cursor editing. Let’s say we have a bunch an array of objects with id and name:
const users = [
{id: 1,name: "Alice"},
{id: 2,name: "Bob"},
{id: 3,name: "Charlie"},
{id: 4,name: "Diana"},
];
And we want to change “name” to “username.” There are a few ways we can do this. We can select the “name” property. Now, to select the next occurrence of “name,” we press CTRL+Alt+Down or Alt+Click . With this, we can change “name” to “username” in one go. To stop multi-cursor editing, we press the Escape button .
Go to File
The next shortcut on our list is “Go to File.” Let’s say we’re looking for a file called “index.” One way to find it is to go to our project and dig into various folders to find that file. This is time-consuming. There’s a faster way: we can press Command + P on Mac or Control + P on Windows. This brings up the search box. Here we can type “index” and this shows all files matching this pattern. There’s an even faster way: we don’t even have to type the full file name. We can type abbreviations. For example, we can type “in” and again we get all files matching this pattern. If you’re looking for a file called “ProductList.test.tsx,” you don’t have to type the full file name; just type “test” to narrow down the search result.
Go to Symbol
The next shortcut on our list is “Go to Symbol.” With this, we can instantly jump to any Functions in our project. A symbol can be a function, a class, a variable, a constant—anything that has an identifier. For example, let’s imagine we are looking for a function called “simulateDelay” and we are not sure where that function is defined. We press Command + T on Mac or Control + T on Windows and search for “checkCart.” There you go—this function is defined in this module. We press Enter, and there is our function.
Command Palette
The next shortcut on our list is the command palette, the gateway for almost any VS Code command. It’s particularly useful when we forget something. To bring it up, we press on Mac or Shift + Control + P on Windows. Here we can access any VS Code command. For example, we can type “theme” to change our color theme. We can type “install extension” to install an extension. We can also type “reload window.” Pretty much all VS Code commands are available here at your fingertips.
Integrated Terminal
The final shortcut we’re going to talk about is the integrated terminal in VS Code. This is useful for accessing our command line without ever leaving VS Code. To access it, we press Control + ` (backtick). The backtick is the character before the number one on your keyboard. Here we have an integrated terminal, where we can access our command line.
Conclusion
Now tell me, what are your favorite VS Code shortcuts? Share your favorites in the comments below. I’m always looking for new ways to work smarter, so let’s help each other. If you found these shortcuts helpful, give this article a thumbs up to help others discover it. And hey, if you want to transform your coding skills even more, hit the subscribe button and the bell icon to always know when I drop new tutorials.
Also read:
English