Angular is a TypeScript based Open Source Web Application Framework widely used by developers around the globe. In this article we will talk about the 5 most used VS code Extensions for Angular developers.
VS Code Extensions are the add-ons that allow you to customize and enhance your experience in VS Code. It adds new features in VS Code which leads to productivity.
Table of Contents
Five Most Used VS Code Extensions
This extension provides a rich editing experience for Angular templates. It shows the variable / field suggestions as soon as you start typing.
The extension provides following features:
- Completion lists– shows suggestions on typing
- Error messages– shows error if the variable is not declared or you are trying to access a wrong field from object
- Quick info– shows quick info when you hover over a variable
- Go to definition– click on variable with CTRL will get you to definition
Prettier is a code formatter tool. It enforces a consistent style by parsing your code and reprinting it with its own rules.
It has its own default set of rules and can be changed as per requirement.
Some great features are:
- Format on Save– it will format the code automatically on save
- Format Selection– only the selected code will be formatted
- Keyboard Shortcuts– it uses the Visual Studio Code’s default command to format
- Linter Integration– it can flag errors, bugs, stylistic errors
REST Client allows you to send HTTP request and view the response in Visual Studio Code directly.
It is a recommended extension for every developer as it decreases some time.
Some great features of it:
- Cancel / Rerun HTTP calls and view the response in separate pane
- Multiple Authentication Support like Basic Auth, Digest Auth etc
Angular Snippets is one of the most used extensions in VS Code by Angular developers.
You can create:
- HTTP Interceptors
- and many more just by start typing about them.
As soon as you start typing, it will automatically add the snippet for that. Isn’t it cool? It is obviously.
Install it now if you do not have it already.
It helps you add a script / link / image tag with autocomplete filenames. If you have the plugin, do not need to worry about the file is correct or not. It will fetch you the correct file reference.
It allows you to create Angular Schematics with a GUI instead of CLI. No more need to remember Angular
generate commands. Just right click on the directory in which you want to add the schematic and start typing what you want to add, it will add.
Well, these are 5 most used VS Code extensions for Angular developers. I would highly recommend checking 7 Best Ways to Improve Angular Code.
Checkout more articles about Angular: Angular Articles