command lab
  • TOP
  • vscode

  • List of vscode shortcuts that you lose without knowing [with practice function]

List of vscode shortcuts that you lose without knowing [with practice function]

Visual Studio Code is an editor developed by Microsoft that runs on Windows, Linux, and macOS and is extremely popular with front engineers. By learning the abundant prepared shortcuts, you can code with a terrible performance.

Here, you can learn shortcut keys in a short time with such a convenient list of shortcut keys of vscode and an intuitive practice function.

You can practice shortcuts below

By repeatedly performing the tasks of the shortcut key that is continuously given one after another, you can make the finger remember the shortcut, and you can use the shortcut key naturally when you need to. Also, the following practice functions include all vscode exercises, so if you want to practice by genre, please select a menu from “TRAINING” on this site and practice.

Press the START button below to enter practice mode.
STARTSTOP
* Input mode switching ctrl + shift + alt + space
PRE
NEXT
Guide mode
Repeat mode
PUSH ENTER

Basic editing

First, I will review the basic editing shortcuts. Even if it’s basic, it’s quite convenient to remember shortcut keys for copy/cut line by line, indentation, line movement, etc.

copyWindowsCtrlc
mac(command)c
cutWindowsCtrlx
mac(command)x
Copy line (not selected)WindowsCtrlc
macc
Cut line (not selected)WindowsCtrlx
mac(command)x
pastingWindowsCtrlv
mac(command)v
undoWindowsCtrlz
mac(command)z
redoWindowsCtrly
mac(command)y
Add indent to current lineWindowsCtrl]
mac(command)]
Remove indent on current lineWindowsCtrl[
mac(command)[
Dialog display of line movementWindowsCtrlg
mac(control)g

Add a blank line

Shortcut for adding a blank line below or above the current cursor position. The nice thing about this shortcut is that you can add a blank line without having to move the cursor to the end or beginning of the line.

Add line belowWindowsCtrlEnter
mac(command)Enter
Add line aboveWindowsCtrlshiftEnter
mac(command)(shift)Enter

Move cursor line

This is a shortcut that allows you to move the cursor up or down in line. Remembering this shortcut is very useful if you want to change the order of the lines. If you have selected multiple lines, you can move each selection. It’s a shortcut that I definitely want to remember, because it is used occasionally when coding.

Move the line at the cursor position downWindowsalt
mac(option)
Move the line at the cursor position upWindowsalt
mac(option)

Copy cursor line

If you add the shift key to the above cursor line movement, it will be a copy.

If multiple rows are selected, the entire selection area is copied, so copying each block is very easy. As you can see, it’s several times more efficient than regular copy and paste, so please remember.

Copy line at cursor downWindowsalt
mac(shift)(option)
Copy line at cursor upWindowsalt
mac(shift)(option)

Comment toggle

This is a shortcut that allows you to add or remove line comments and block comments. It is convenient to remember because it is a function that people who write programs often use. By the way, in HTML, there is one type of comment, but when it comes to programs, there are two types of comment out, one for lines and one for multiple lines. A little comment is usually a one-line comment.

Toggle line commentWindowsCtrl/
mac(command)/
Block comment toggleWindowsshiftalta
mac(shift)(option)a

Select current line

This is a shortcut to select the line where the cursor is. You can select multiple lines if you enter them consecutively. If you remember this shortcut, you can select a line without dragging from the beginning of the line to the end of the line, which will greatly improve the work efficiency.

Select current lineWindowsCtrll
mac(command)l
2 line selectionWindowsCtrll
mac(command)l

Multiple selection of selected words

If you have more than one word selected, you can use this shortcut to edit them at the same time. You can increase the number of selected words by repeating the input. As a usage, in HTML, it is very convenient when changing a class name, or when changing a variable name in a program.

Word selectionWindowsCtrldd
mac(command)d
Select the same word multiple times (select two command examples)WindowsCtrld
mac(command)d

Display relation

Switch the sidebar display switches the display/non-display of the sidebar that stores Explorer (file management tab), search function, git function, etc. If you work with a narrow display such as a laptop computer, it is convenient to remember this shortcut.

Switch back position is a shortcut to switch whether to automatically switch back the code. You can switch whether to wrap at the edge of the screen. It will be easier to edit if there is automatic wrapping, but it will be less readable, so it is very convenient to use it properly in different situations.

Switch sidebar displayWindowsCtrlb
mac(command)b
Switching back positionWindowsaltz
mac(option)z

Various search and replace

It’s a staple, but there are also shortcuts for search and replace. There is a search/replace in the open document and a search/replace in a folder or workspace, and regular expressions can also be used.

Search in editorWindowsCtrlf
mac(command)f
Replace in editorWindowsCtrlh
mac(command)(option)f
Search by selectionWindows規定なし
mac(command)e
Search entire folder/workspaceWindowsCtrlshiftf
mac(command)(shift)f
Replace entire folder/workspaceWindowsCtrlshifth
mac(command)(shift)h

File operation

File operation related shortcuts. The one key to remember is the “Find files by name” shortcut key. I am basically moving files with this. If you remember the file name, you can instantly jump to that file, which is very useful.

Open new fileWindowsCtrln
mac(command)n
Open fileWindowsCtrlo
mac(command)o
Open folderWindowsCtrlk
mac規定なし
Save fileWindowsCtrls
mac(command)s
Search files by nameWindowsCtrlp
mac(command)p

コメントを残す

CAPTCHA


The comment will be displayed after approval by the site administrator. Please follow the manners and comment.