Tools and Plugins for Angular development

You will find a lot of tools, extensions and IDEs to work on Angular and in general in web developemnt. Here is a list of the tools and plugins I use and recommmend for Angular and web development.

Source Code Editor

Visual Studio Code

Visual Studio Code is source code editor from Microsoft that plays very well with Angular and web development.

  • Great integration with Typescript (Also from Microsoft)
  • Large number of extensions for Angular and web development
  • Versions for Windows, MacOS and Linux

You can get this tool for free from it's official site: https://code.visualstudio.com/

Angular Language Service

This is an extension for Visual Studio Code from the Angular team that provides the following services for Angular templates:

  • Completion of code lists
  • AOT (Ahead-of-time) Diagnostic messages
  • Quick info
  • "Go to definition" feature

You can get it from the Visual Studio Code Market place

Angular Component Libraries

Component Libraries speed up the development process and makes easier to achieve consistency on UIs. There are a few options when it comes to component libraries that have native Angular components, I will only share here the ones I have used in the past.

Kendo UI for Angular

Kendo UI has an extensive library of controls provided by Telerik, it currently provides over 100 native controls for Angular. I had the opportunity to work with Kendo UI components while working on a SaaS platform for automotive dealers in the US. In that project we used grids, charts, buttons, navigation controls, and Input controls to build complex forms. Most often these controls were wrapped into our own controls, this allowed us tweak the behavior of these controls, set some defaults, and modify their appeareance to get aligned with our UI requirements. For the layout of pages we used the bootstrap grid system in combination with Kendo UI controls such as menus, cards, and popups.

Kendo UI is only available under payment. You can find more about these components here

PrimeNG

I used PrimeNG components while working on different apps in the Oil Á Gas industry. Components such as cards, panels, menu, and form components were widely adopted by multiple teams in different apps of the platfrom. For layouts there were very particular needs to target different types of screens and devices, most of the apps used CSS Flexbox and Grid layouts directly instead of libraries.

PrimeNG is available under MIT license. You can find more about it on its site

Angular Material

Angular Material is a component library that follows the Material Design Specification, it is maintained by the Angular team in an opensource project. I have only used Angular Material in pet projects but I know of teammtes that have used it in projects for human resources and payroll applications.

Angular Material is available under a MIT license. You can find more about Angular Material in its official site.