If like me, you are excited by Visual Studio Code (read about it here), you will be delighted to hear that there is a helpful short eBook list of 'hints and tips' published recently to help you be more productive and make the best use of this amazing new tool. Put together by the guys at the core team, it gives a brief background to @code, and then jumps straight into a seriously useful list of tips and tricks. Here is an overview.

Multiple Cursors

Visual Studio lets you work on different sections of a file at the same time. This can come in handy when you need to perform many identical changes. To create a new cursor, simply click on the respective area in the text editor while holding down the Alt key. From that point onwards any keyboard input will be applied to all cursor positions. It is also possible to select multiple sections in your code.



Hiding Undesired Folders

If you have files or folders that you’ll never edit within opened folders, you can hide those files or folders in the explorer view. One example would be the node_modules folder in a Node.js project. To hide the file, folder or any pattern, you need to reference them in the "files.exclude" option in your global or workspace settings. User the workspace settings to hide those entries only within the active project. Page 11 of 26 Opening the workspace settings is as easy as executing the command Preferences: Open Workspace Settings. If there is no workspace settings file yet, VS Code will create it automatically. One useful example of pattern use is hiding any JacaScript resources generated from TypeScript,
  1. "files.exclude": {
  2. "**/*.js": {
  3. "when": "$(basename).ts"}
  4. }

Keyboard Shortcut Chords

Just like Visual Studio, Visual Studio Code supports keyboard shortcut chords: The editor is awaiting a second keyboard shortcut after the first keyboard shortcut has been entered. This allows for grouping of similar commands. As an example, you could change the search in a file from Ctrl+F to Ctrl+F Ctrl+F and the global search in all files to Ctrl+F Ctrl+G. In keybindings.json, the keyboard shortcuts for the chord must be separated using a blank space.



Visual Studio Code is awaiting additional input after the first shortcut of a chord has been applied. You’ll find this referenced in the status bar as „(Ctrl+F) was pressed. Waiting for second key of chord“.

Visualizing CSS Selectors

CSS selectors precede any CSS clause. They define what HTML elements to style with the subsequent properties. Selectors can become pretty complicated – and be it because sometimes you just might not be too familiar with one of them that you are using less frequently. Visual Studio Code solves this problem by presenting a preview for the current selector that shows what HTML elements would have to be like to be covered by the selector.



That's my top few tips from the guide - if you are starting to use @code, I urge you to download the attached PDF and start getting productive ... it's very much worthwhile.