Building Your First Angular Application

To better understand how to develop an Angular application, we need to learn some basic but essential things to have a great experience on our journey with the Angular framework. One of the primary things we should know is what Angular is and why we should start using it for web development. We will also take a tour of the history of Angular to understand how the platform evolved.

Another important but sometimes painful topic is setting up our development environment. It must be done at the beginning of a project but getting this right early can reduce friction as our application grows. Therefore, a large part of this chapter is dedicated to Angular CLI, a tool developed by the Angular team that provides scaffolding and automation tasks in an Angular app, eliminating configuration boilerplate and saving developers from facing future frustrations. We will use the Angular CLI to create our first application from scratch, get a feel for the anatomy of an Angular application, and take a sneak peek at how Angular works under the hood.

Working in an Angular project without an Integrated Development Environment (IDE) can be painful. Our favorite code editor can provide an agile development workflow that includes compilation at runtime, static type checking, introspection, code completion, and visual assistance for debugging and building our app. We will highlight Visual Studio Code (VS Code), one of the most popular editors in the Angular ecosystem, with a rich collection of extensions for working with Angular.

To sum up, here are the main topics that we will explore in this chapter:

• What is Angular?
• Why choose Angular?
• Setting up the Angular CLI workspace
• Structure of Angular application
• VS Code tooling