Auto Save Never worry about saving your work, check this and it will do it for you after a brief pause Works great with watcher’s to recompile/build code automatically. Integrations with Externals Tools via TasksUse one of the already existing task runners like Make, Ant, Gulp, Jake, Rake and MSBuild Running inside VS Code can be helpful to watch them run and analyze their results In the Command Palette (Ctrl+Shift+P) you can filter and run tasks Emmet Snippets Out of the box support – not an extension Instantly expand simple abbreviations into complex code Easily add classes, id, text and other attributes to html tags Grouping, Numbering, Multiplication, Nesting Quickly churn out HTML & CSS Works for HTML 5 and CSS 3 Code Formatting Out of the Box functionality I like my code nicely indented and spaced ALT+SHIFT+F There are numerous plugins but I didn’t like them Even More Snippets Visual Studio Code https://code.visualstudio.com Visual Studio Code Marketplace https://marketplace.visualstudio.com/ vscode-icons https://marketplace.visualstudio.com/items?itemName=robertohuertasm.vscode-icons Jshint https://marketplace.visualstudio.com/items?itemName=dbaeumer.jshint HTML CSS Class Completion https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion jQuery Code Snippets https://marketplace.visualstudio.com/items?itemName=donjayamanne.jquerysnippets Emmet Snippets https://www.smashingmagazine.com/2013/03/goodbye-zen-coding-hello-emmet/

1. Visual Studio Code
Productivity Tips &
Favorite Extensions

2. Auto Save
• Never worry about saving your work, check this
and it will do it for you after a brief pause
• Works great with watcher’s to recompile/build
code automatically.

3. Integrations with Externals Tools via Tasks
• Use one of the already existing task
runners like Make, Ant, Gulp, Jake, Rake
and MSBuild
• Running inside VS Code can be helpful
to watch them run and analyze their
results
• In the Command Palette (Ctrl+Shift+P)
you can filter and run tasks

4. Emmet Snippets
• Out of the box support – not an extension
• Instantly expand simple abbreviations into complex code
• Easily add classes, id, text and other attributes to html tags
• Grouping, Numbering, Multiplication, Nesting
• Quickly churn out HTML & CSS
• Works for HTML 5 and CSS 3

5. Code Formatting
• Out of the Box functionality
• I like my code nicely indented and spaced
• ALT+SHIFT+F
• There are numerous plugins but I didn’t like them

6. vscode-icons

10. Even More
Snippets

11. Resources
• Visual Studio Code
• https://code.visualstudio.com
• Visual Studio Code Marketplace
• https://marketplace.visualstudio.com/
• vscode-icons
• https://marketplace.visualstudio.com/items?itemName=robertohuertasm.vscode-icons
• Jshint
• https://marketplace.visualstudio.com/items?itemName=dbaeumer.jshint
• HTML CSS Class Completion
• https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion
• jQuery Code Snippets
• https://marketplace.visualstudio.com/items?itemName=donjayamanne.jquerysnippets
• Emmet Snippets
• https://www.smashingmagazine.com/2013/03/goodbye-zen-coding-hello-emmet/