DEV Community

loading...
Cover image for 16 VS Code Shortcuts for Faster Coding
Basecamp Community

16 VS Code Shortcuts for Faster Coding

surajondev profile image Suraj Vishwakarma Originally published at surajondev.wordpress.com Updated on ・4 min read

Introduction

Microsoft's VS code is one of the most popular text/code editors available on the internet. VS Code is an IDE(Integrated Development Environment), We can make it more powerful by using the extensions and it's very easy to customize.

Coding

It comes with emmet pre-built which no other text editor does and it also allows us to tweak into its code so we can even modify its environment variables according to our preferences. It has a large collection of extensions which you can use for your requirement.

Today we are going to look into shortcuts of VS code that will help you to code more effectively.

Keyboard Shortcuts

1. Command Palette

  • Keyboard Shortcut: Ctrl+Shift+P
  • Access all available commands based on your current context.

Alt Text

All of the commands are in the Command Palette with the associated key binding (if it exists). If you forget a keyboard shortcut, use the Command Palette to help you out.


2. Quick Open

  • Keyboard Shortcut: Ctrl+P
  • Quickly open files.

QuickOpen


3. Errors and warnings

  • Keyboard Shortcut: Ctrl+Shift+M
  • Quickly jump to errors and warnings in the project.

Errors and warnings


4. Change language mode

  • Keyboard Shortcut: Ctrl+K M
  • Persist the new language mode for that file type

Errors and warnings


5. Change your theme

  • Keyboard Shortcut: Ctrl+K Ctrl+T
  • You can install more themes from the VS Code extension Marketplace.

Change your theme


6. Toggle Sidebar

  • Keyboard Shortcut: Ctrl+B
  • Show and hide the status bar.

Toggle Sidebar


7. Zen mod

  • Keyboard Shortcut: Ctrl+K Z
  • Enter distraction-free Zen mode.

Zen mod


8. Side by side editing

  • Keyboard Shortcut: Ctrl+\
  • You can also drag and drop editors to create new editor groups and move editors between groups.

Side by side editing


9. All Selection

  • Keyboard Shortcut: Ctrl+Shift+L
  • You can add additional cursors to all occurrences of the current selection.

All Selection


10. Next Selection

  • Keyboard Shortcut: Ctrl+D
  • This only selects the next occurrence after the one you selected so you can add selections one by one.

Next Selection


11. Copy line up/ down

  • Keyboard Shortcut: Shift+Alt+Up or Shift+Alt+Down
  • Copy the whole line and paste it into the line above or below.

Copy line up/ down


12. Move line up and down

  • Keyboard Shortcut: Alt+Up or Alt+Down
  • Move the whole line above and below as required.

Copy line up/ down


13. Code formatting

  • Currently selected source code: Ctrl+K Ctrl+F
  • Whole document format: Shift+Alt+F
  • Format your untidy code to clean your code for more readability.

Code formatting


14. Open Markdown preview

  • Keyboard Shortcut: Ctrl+Shift+V
  • See Markdown preview for markdown file.

Open Markdown preview


15. Side by side Markdown edit and preview

  • Keyboard Shortcut: Ctrl+K V
  • The preview and editor will synchronize with your scrolling in either view.

Open Markdown preview


16. IntelliSense

  • Keyboard Shortcut: Ctrl+Space
  • You can view available methods, parameter hints, short documentation, etc.

IntelliSense


🔗 Connect with me:

Currently, on Twitter, I am posting about "How to write and grow blog?". If you want to write a more effective blog with tips, consider the follow button on Twitter.

With this completing 500 tweets🥳.

Thank you to everyone🤩.

As helping more people, I am going to tweet about writing and growing blog especially technical, in the coming days🔥.

So if you haven't followed me, please consider🤗.

— Suraj Vishwakarma (@surajondev ) May 17, 2021

Twitter

Last Note

I hope this post will help you write code effectively. Thank you for reading the post.

Discussion (25)

Collapse
branislavtotic profile image
Branislav Totic

Few extra:
Ctrl+Shift+K - delete line with carrot on
Ctrl+K W - close all opened tabs

Collapse
alokjoshi profile image
AlokJoshiOfAarmax

Branislav, Ctrl+K W does not work if I am doing side-by-side editing

Collapse
branislavtotic profile image
Branislav Totic

I never noticed because I always kinda hold ctrl and then press k and then w. Anyway Ctrl+K W does not work but Ctrl+K Ctrl+W works
example

Thread Thread
surajondev profile image
Collapse
eddsaura profile image
Jose E Saura

Damn son!

Collapse
sdahlbac profile image
Simon Dahlbacka

An fairly recent discovery for me: You know when you Cmd/Ctrl+D one too far... Cmd/Ctrl+U saves your bacon

Collapse
luizcarlosnv profile image
luizcarlosnv

To HTML files workers: type ctrl+shift+. and browser over the DOM of this file!

Collapse
oloshe profile image
oloshe

ctrl + shift + o
Find symbol in this file.
Equivalent to Ctrl + p and type a @
U can also Ctrl + p find a file then type a @ to continue find declare in this file.

Collapse
yansusanto profile image
Yan Susanto

Ctrl+D that's what I've been looking for. Thanks for sharing.

Collapse
surajondev profile image
Collapse
abhishektripathi profile image
Abhishek Tripathi

Here is an exhaustive list of all the useful shortcuts. You may want to print it.

code.visualstudio.com/shortcuts/ke...

Collapse
imamhsn195 profile image
Imam Hasan • Edited

nice
Is there any shortcut to remove extra blank lines?

Collapse
thematrixadmin profile image
Oskar Pietrucha

You can configure such a behavior in formatter settings. Personally, I recommend you Prettier

Collapse
surajondev profile image
Suraj Vishwakarma Author

Yess, prettier is best for formatting your code.

Collapse
surajondev profile image
Collapse
huzaifa99 profile image
Huzaifa Rasheed

Zen Mode💥

Collapse
l4znet profile image
Charly Escalona

Thx, very useful

Collapse
tindecken profile image
Nguyễn Thái Hoàng

Thanks for sharing, it's very usefull

Collapse
juhoheinonen profile image
juhoheinonen

Thanks, useful tips!

Collapse
beogradska_ajkula profile image
Nikola Mihajlović

Waited so long for ctrl + D! Thank you very much!

Collapse
deghedy profile image
Mahmoud Aboudeghedy

Very helpful, keep going bro

Collapse
surajondev profile image
Collapse
chamampi profile image
chamampi

Thanks for sharing

Collapse
songhanpoo profile image
songhanpoo

With macos ?

Collapse
jwkicklighter profile image
Jordan Kicklighter

These should all work on MacOS

Forem Open with the Forem app