Installing VS Code Angular plugins

As mentioned in the previous chapters, the VS Code text editor is a fantastic IDE for developing web applications using JavaScript and TypeScript, and the same goes for Angular.

In this section, we will look at some extensions (also called plugins) that can help us with our development.

Let's look at the package names and repository URLs:

• Angular Language Service: https://github.com/angular/vscode-ng-language-service. Provided by the official Angular team, this extension helps us with completions in template files and template strings, and diagnostics for templates and Angular annotations.
• Angular v5 Snippets: https://github.com/johnpapa/vscode-angular-snippets. The extension name is Angular v5; the GitHub project repository doesn't specify a name. So, we can expect snippets for future versions of Angular from the plugin author. This is a powerful tool that can help us to create almost everything within an Angular application; you can see the complete list in the GitHub repository.
• Angular Support: https://github.com/VismaLietuva/vscode-angular-support.

Go to and peek definition from:

interpolation {{ someVar }}
input [(...)]="someVar"
output (...)="someMethod"
templateUrl or styleUrls in @Component decorator
component <some-component></some-component>

Last but not least, we recommend that you use the GitLens plugin. This extension is extremely important, because it helps us to visualize our code in the Git repository, while also providing integration with GitHub or Bitbucket.

• GitLens: https://github.com/eamodio/vscode-gitlens.

• You can explore the navigation for repositories and file histories
• You can also explore commits and visualize comparisons between branches, tags, and commits
• There is an authorship code lens, showing the most recent commits and number of authors to the top of files and/or on code blocks
• GitLens Plugin: https://gitlens.amod.io/. This extension is extremely important, because it helps us to visualize our code in the Git repository, while also providing integration with GitHub or Bitbucket.
  
  Also, it's possible to install any extension through the IDE itself. To do that, follow these steps:
  1. Open VS Code.
  2. Click on the last icon on the left-hand sidebar; you can see it in the following screenshot:

Just type what you want to search for in the search input field, and click install.

We now have everything we need to start developing Angular applications. In the next section, we will look at how to create an Angular application using the Angular CLI.