VS Code Shortcuts

In the world of software program improvement, time is a precious commodity. With closing dates looming and tasks piling up, anything that can save time and improve productivity is crucial. That's where Visual Studio Code (VS Code) is available. Visual Studio Code (VS Code) is one of the most famous and widely used code editors. It’s open-source and free to use.

VS Code Shortcuts; Source: Visual Studio Code

It additionally presents support for many languages and frameworks through integrated features or the full-size list of extensions available for the editor. One of VS Code's most treasured capabilities is its enormous keyboard shortcuts that allow builders to carry out unexpected responsibilities quickly and successfully. This text will highlight the most important VS Code shortcuts that every VS Code consumer should know to improve their work.

Easy VS Code Shortcuts

VS Code Shortcuts; Source: Visual Studio Code

Open a file

Searching for a specific report, mainly as the undertaking gets larger, can take quite a while. Even if you already recognize where the report is, it’s helpful to know this keyboard shortcut to open documents on your project easily.

  • Windows/Linux: ctrl + P
  • macOS: command + P

Zen mode

Although this is unrelated to knowing the code and definitions, this shortcut is useful if you want to be targeted for your code. With this shortcut, you may enable Zen mode, which allows you to change the display to be focused on the currently open document.

  • Windows/Linux: ctrl + K, then Z
  • macOS: command + K, then Z

Press the identical keyboard shortcut to return to the everyday editor view.

Open settings

Visual Studio Code has many functions and settings that you can change to fit your needs. This keyboard shortcut makes it less complicated to get to the settings every time they are important

  • Windows/Linux: ctrl + ,
  • macOS: command + ,

Toggle Sidebar

A lot of times, you need extra space for the open file you’re running on. So, this keyboard shortcut is on hand to reveal or cover the sidebar on every occasion.

  • Windows/Linux: ctrl + B
  • macOS: command + B

Open the terminal

During your improvement, you’ll most likely utilize the terminal lots. You can start a terminal window inside the editor in Visual Studio Code. As a result, you can concentrate entirely on the editor and the code without switching between it and the terminal.

  • Windows/Linux: ctrl + J
  • macOS: command + J

Open the command palette

There are lots of instructions you can execute in Visual Studio Code. These commands can be related to out-of-the-field functions or extension functions.

You can quickly open the command palette by using this keyboard shortcut. The command palette lets you look through the instructions you could use and execute them.

  • Windows/Linux: ctrl + shift + P
  • macOS: command + shift + P

Select current line

In a lot of instances, you need to choose the entire current line your cursor is on. It is very simple with this keyboard shortcut.

  • Windows/Linux: ctrl + L
  • macOS: command + L

Go to line

Finding code at a certain line is helpful when you get a compile or runtime error specifying what line of code brought about it. This keyboard shortcut eliminates the need to find the line yourself clearly.

  • Windows/Linux: ctrl + G
  • macOS: control + G

Indent/outdent lines

As you replicate lines from one vicinity or report to another, or as you make adjustments to the code, the code will come to be wrongly indented. This shortcut permits you to indent or outdent traces as needed easily. Select a couple of strains to move them all together.

  • Windows/Linux: ctrl + [ or ]
  • macOS: command + [ or ]

Go to matching bracket

You’ll often want to discover a block's matching ultimate bracket. This is especially true as the documents grow with time. This keyboard shortcut lets you effortlessly find the final matching bracket of the contemporary block. It enables you to advance to the end of the current HTML tag.

  • Windows/Linux: ctrl + shift + \
  • macOS: command + shift + \

Select till the end of the phrase

You can easily navigate and expand the selection with this shortcut when selecting a certain part of the code. Use the right or left arrows to move in the desired direction.

  • Windows/Linux: shift + alt + → or ←
  • macOS: shift + option + → or ←

You can use this keyboard shortcut to transport between found results within the active document.

  • Windows/Linux/macOS: F3

Note: On macOS, press FN at the same time as F3.

Fold/unfold Block

When reading a document with several traces or records, it’s easier to fold (hide) an entire block that you’re not currently using so that you can focus on something else. This keyboard shortcut permits you to fold or spread a block. Click everywhere inside the block, then hit the subsequent keys.

  • Windows/Linux: ctrl + shift + [ or ]
  • macOS: command + option + [ or ]

Finding errors and warnings in your code is critical. Sometimes some mistakes aren't easy to discover, including when a line doesn’t end with ; because it must. This keyboard shortcut saves you the trouble of scrolling or, very well, looking through the road to find the exact hassle. It lets you move on to the subsequent errors or warnings.

  • Windows/Linux/macOS: F8

Note: On macOS, press FN at the same time as F8.

Insert additional cursors

There are two methods to insert an extra cursor into the report: either at a selected function or above or under the current line the cursor is at.

1. At position

This keyboard shortcut lets you insert an additional cursor at any point in the report.

  • Windows/Linux: alt + mouse click at the position
  • macOS: option + mouse click at the position

2. Above or below

The second way to insert a cursor is to insert it above or underneath any current cursor positions.

  • Windows/Linux: ctrl + alt + ↓ or ↑
  • macOS: command + option + ↓ or ↑

Undo cursor insert

What if you inserted a cursor by mistake or found out later that you didn’t want to insert the cursor in that role anymore? This keyboard shortcut lets you undo the last cursor insert. This may be very useful once you’ve inserted a couple of cursors because it allows you to keep the others in place and get rid of the final one.

  • Windows/Linux: ctrl + U
  • macOS: command + U

Insert the cursor on the end of a highlighted selection

Another keyboard shortcut that makes your improvement faster is to insert the cursor at the end of a highlighted selection.

  • Windows/Linux: shift + alt + I
  • macOS: shift + option + I

Copy lines and blocks

What if you duplicate a line and paste it below or above?

Instead of copying and pasting the road, this shortcut duplicates the road either beneath or above it, based totally on the direction selected with the arrows.

  • Windows/Linux: shift + alt + ↓ or ↑
  • macOS: shift + option + ↓ or ↑

To move a block of text or code similarly, spotlight it first and then use this shortcut.

Move lines and blocks

A lot of times, you may need to move a line from one position to another. Instead of copying, reducing, and pasting the road into every other function, this shortcut offers a faster solution. Just place the cursor on the line.

  • Windows/Linux: alt + ↓ or ↑
  • macOS: option + ↓ or ↑

This will even move an entire paragraph of text that the cursor is active in. If you want to transport a block of code, virtually spotlight that code before pressing the shortcut above.

Toggle comments

In many instances, you might want to comment or uncomment a line. This can be easily finished with this shortcut. This works for both line and block feedback.

Line Comments

Click on the line you need to comment out. (If you spotlight a block of code, this command will comment out each line individually.)

  • Windows/Linux: ctrl + /
  • macOS: command + /

Block Comments

Unlike the above shortcut, the subsequent shortcut will comment out the code you highlight as a single comment.

  • Windows/Linux: shift + alt + A
  • macOS: shift + option + A

Code formatting

It’s critical to keep your code and files formatted for readability reasons. Visual Studio Code presents shortcut instructions for code formatting.

File

This shortcut allows you to format the whole document.

  • Windows/Linux: ctrl + shift + F
  • macOS: option + shift + F

Selection

This shortcut permits you to format just the chosen set of lines in a file.

  • Windows/Linux: ctrl + K, then ctrl + F
  • macOS: command + K, then command + F

Run code

One cool VS Code feature is the option to run code right inside the editor. This depends on the language, framework, or kind of code you want to run. For instance, you may install debugging for Javascript projects. However, if you have a debugger or project runner configured, you may use this shortcut to run code in VS Code.

  • Windows/Linux/macOS: F5

Note: On macOS, make certain to press FN at the same time as F5.

Check definition

It’s critical to recognize the definition of the code we’re using before using it. These Visual Studio Code shortcuts permit us to see their definition and documentation effortlessly from the editor.

Go to definition

This shortcut takes us to the report or line wherein the part of code is to begin with defined.

  • Windows/Linux/macOS: F12

Note: On macOS, ensure to press FN at the same time as F12.

Peek Definition

This shortcut allows us to open definitions and documentation inside the same region where we check the definition. This makes it less complicated to peer at the definition without moving to another document or line.

  • Windows/Linux: alt + F12
  • macOS: option + F12

Note: On macOS, press FN at the same time as F12.

Toggle suggestions

While writing our code, VS Code or some extensions we’ll have hooked up will show us suggestions for our code. This shortcut lets us toggle the tips to see or hide them.

  • Windows/Linux: ctrl + I
  • macOS: command + I

Conclusion

VS Code is one of the first-class code and text editors for builders for the time being. It presents many out-of-the-box functions and an extension marketplace that lets developers make contributions and offer extensions for the community without problems.

VS Code Shortcuts; Source: Visual Studio Code


This article has provided a complete listing of the most important shortcuts that every VS Code user should recognize. These shortcuts cover various areas, including file control, modifying code, navigating the editor, and accessing VS Code functions. By incorporating those shortcuts into your daily routine, you may save effort and time, reduce errors, and emerge more efficient. With enough practice and familiarity with those shortcuts, you could increase your coding abilities to new heights and take full advantage of what VS Code offers.



How much is a great User Experience worth to you?


Browsee helps you understand your user's behaviour on your site. It's the next best thing to talking to them.

Browsee Product