Photo by Kevin on Unsplash - https://unsplash.com/photos/w7ZyuGYNpRQ
Here is a list of some extensions I come to enjoy with VS Code. Since I work a lot in the frontend most of these extensions will be useful for web developers.
I have been working previously with Atom, Visual Studio and Webstorm but VSCode suits me best and is just incredible. The developer did a great job ( and still do! ). Try it for yourself and enjoy!
“To enjoy life, you don't need fancy nonsense, but you do need to control your time and realize that most things just aren't as serious as you make them out to be.”
― Timothy Ferriss
Automatically add HTML/XML close tag, same as Visual Studio IDE or Sublime Text does.
Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.
This extension adds rich language support for the HTML Markup to VS Code, including: Full HTML5 Tags, Colorization, Snippets
This VS Code extension automatically shows Markdown preview whenever you open new Markdown file. If you feel annoying to type "Ctrl+K V" or "⌘+K V" (preview side-by-side) many times, this extension helps you.
Generate TOC (table of contents) of headlines from parsed markdown file.
A set of themes based on SublimeText-Markdown/MarkdownEditing.
A basic spell checker that works well with camelCase code.
Adds JS Babel es6/es7 syntax coloring
Debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger protocol.
Integrates ESLint into VS Code.
This extension contains code snippets for JavaScript in ES6 syntax for Vs Code editor (supports both JavaScript and TypeScript).
A basic spell checker that works well with camelCase code.
Visual Studio Code plugin that autocompletes JavaScript / TypeScript modules in import statements.
Integrates the tslint linter for the TypeScript language into VS Code.
Syntax highlighting for styled-components.
GraphQL syntax highlighting, linting, auto-complete, and more!
yarn commands for VSCode
vscode-ext-color-highlight
This extension styles css/web colors found in your document.
Custom CSS to your VS Code. Based on robertohuertasm’s vscode-icons.
EditorConfig helps developers define and maintain consistent coding styles between different editors and IDEs. The EditorConfig project consists of a file format for defining coding styles and a collection of text editor plugins that enable editors to read the file format and adhere to defined styles.
Visual Studio code extenstion that allows to quickly create new files based on defined templates.
View git log along with the graph and details.
View the history of a file (Git log) or the history of a line in a file (Git Blame). View a previous copy of the file. Compare a previous version with the version in the workspace or another. View commit log details for a selected commit. Compare commits.
A Visual Studio Code extension for more guide lines
The Material Icon Theme provides lots of icons based on Material Design for Visual Studio Code.
Provide rainbow colors for the round brackets, the square brackets and the squiggly brackets.
VS Code package to format your JavaScript / TypeScript / CSS using Prettier.
Manage your projects right inside Visual Studio Code. Easily access and switch between them.
Seti Monokai color scheme
Metrics, insights, and time tracking automatically generated from your programming activity.
Synchronize Settings, Snippets, Themes, File Icons, Launch, Keybindings, Workspaces and Extensions Across Multiple Machines Using GitHub Gist.
Thanks for reading my article! Feel free to leave any feedback!
Daniel is a LL.M. student in business law, working as a software engineer and organizer of tech related events in Vienna.
His current personal learning efforts focus on machine learning. Connect on:
