There are several important keyboard shortcuts that can be easily accessed in the Visual Studio Code. But not everyone knows about these shortcuts. Below is the list of shortcuts that should be used by all developers to increase their productivity substantially.
- Command Palette.
- Accessing Settings.
- Duplicating lines.
- Emmet Abbreviations.
- Moving a line up or down.
- Adding Indentations.
- Format Document.
- Multiple selections.
- Multiple cursors.
- Comment lines.
- Show and hide the terminal.
- Split terminal.
- Switch between terminals.
- Toggle sidebar.
- Sidebar file explorer.
- Sidebar search all.
- Sidebar Github.
- Sidebar Visual Studio Code extensions.
People also search for:
The command palette is one of the most useful tools in the Visual Studio Code. It is lots of features and it can be used for searching a file by name, going to a specific line, and accessing different settings in Visual Studio Code. The keyboard shortcut for the command palette is given below.
Uses of command palette:
- Searching file by name.
- Going to a specific line.
- Accessing different settings in Visual Studio.
The settings page is useful for setting the different setting values of the highly customizable Visual Studio Code. The settings can be easily accesses using the below shortcut.
Duplicating the lines:
Visual Studio code helps the users to duplicate the lines above and under the given line. This is useful while coding in HTML because HTML often involves repeating the same code over and over again.
Duplicate code up on Windows:
Duplicate code down on Windows:
Duplicate Code up on Mac:
Duplicate Code down on Mac:
We know that creating an ordered list and the unordered list is painful with the same list-item tag repeating every time. This can be made easy by using the below technique. The following steps will give the output in the image instantaneously without even typing all that code.
Follow these steps to get the desired output.
- Type ul.
- Type #MyId as shown in the figure.
- Type .MyClass as shown in the figure.
- Use the greater than symbol. It is used to tell Visual Studio code that the elements followed are inside the previously given elements.
- Now enter li as shown in the figure.
- Now enter *5(times 5).
- You will see these emmet abbreviations being shown.
- Press tab.
Clearly Emmet abbreviation is a very powerful tool that makes coding very easy in Visual Studio code.
Moving a line up/down:
We can easily move a line up and down in the Visual Studio Code. This helps us reposition the content with ease. This underrated shortcut will save tons of copy-pasting time.
Move line up on Windows:
Move line down on Windows:
Move line up on Mac:
Move line down on Mac:
Adding indentations helps make the code more readable. We can add indentations using the below keyboard shortcuts.
Adding indentations are very useful when we have only a small piece of code to make it readable. Formating the entire document is recommended over adding/removing indentations. The below keyboard shortcut will format the document. Not only that it brings the right amount of indentations for the code but also puts them in a very readable format.
Multiple selections help us to change the multiple instances of the code into something. This helps us drop a cursor at every instance of the text.
Multiple cursors help us drop multiple cursors at various instances of the code. This lets us add text at all the places without having to copy and paste the text again and again.
We can select multiple lines and comment on them using this easy keyboard shortcut.
In addition to this keyboard shortcut, we can use another shortcut as well.
Show and Hide terminal:
The terminal is an integral part of development. It is integrated into Visual Studio code for easy access. The terminal can be shown and hidden using the following keyboard shortcut.
We can have multiple terminals at the same time. We can split the terminal using the following command.
Switch between the terminals:
After splitting the terminal, we can switch between the terminals using the below keyboard shortcut. This shortcut will let us switch between the terminals in the left and right.
Go to right terminal on Windows:
Go to left terminal on Windows:
Go to right terminal on Mac:
Go to left terminal on Mac:
Toggle Side Bar:
The sidebar is very useful to get to the project files, git repository, Visual Studio Code extensions, and more. But at times, we can appreciate a screen full of code editor. We can toggle the sidebar using the following shortcut.
Sidebar file explorer:
We can access the files in the project using the sidebar. The explorer pane in the sidebar is for this purpose. We can access the explorer using this shortcut.
Sidebar Search all:
We can search for a text in the entire project files using the keyboard shortcut.
We can perform the repository actions from the integrated source control manager.
Sidebar VScode Extensions:
We can add, search, remove different Visual Studio Code extensions from the sidebar. This keyboard shortcut will bring up the extension manager.
In this post, we learned about many useful keyboard shortcuts in Visual Studio code. Visual Studio Code is full of tricks and features that make the life of the developer very easy. If you want to know more about it, let us know in the comments below.
For more awesome and useful posts, stay tuned to TecKangaroo.