Extensions are cool but, too many can affect performance and complicate things. As developers, we can use extensions to automate stuff and save time which in turn boosts productivity. In this post, I’ll share some of the extensions I use and had saved me a lot of time to write better code.
Auto Rename Tag
- Works for HTML in JS too
- Auto rename HTML/XML tags
HTML CSS Support
- Basic CSS validation
- HTML attribute support
- Link and embed stylesheets
Bracket Pair Colorizer 2
- We can also customize the colors
- Assigns the same color to matching brackets
Prettier – Code formatter
- Clean and consistent code formatting
- Supports many languages out of the box
- You can also add a config file to save your preferences
ESLint
- ESLint integration in VS Code
- TypeScript lang support included
What is ESLint?
ESLint is a tool that analyzes your code and helps you fix common syntactical errors that might cause problems later, hence automatically maintain code quality.
Visual Studio IntelliCode
The list is not complete without this, IntelliCode offers AI-assisted code completion and it gets much better in the case of javascript. I personally simplified a lot of my code using some of the suggestions offered. TypeScript support is also great.
ES7 React/Redux/GraphQL/React-Native snippets
One of the best extensions for React developers, just type “RFC” to get the boilerplate code for a React Functional Component. Snippets include js, react, react-native, react in typescript, redux, react-native in typescript, and GraphQL. There are similar extensions for other javascript frameworks like Vue.js and Angular.js.
vscode-icons
We might be working with a variety of dotfiles like (.git) and folders like assets, components, and redux. Sometimes, it is easier to identify files by their icons and this extension makes it possible.
When it comes to themes there are a lot of variants and I use the Material theme. What are your favorite extensions?