Chapter 8. Creating an Angular application with TypeScript

 

This chapter covers

  • Using the Angular CLI and creating an Angular application
  • Understanding the basics of TypeScript
  • Creating and using Angular components
  • Getting data from an API and binding data to HTML templates
  • Building an Angular application for production

Here it comes. It’s time to take a look at the final part of the MEAN stack: Angular! When you’re getting started with Angular and TypeScript, it can feel like a different language at times, but TypeScript is a superset of JavaScript, so it’s JavaScript with some additional bits and pieces. TypeScript is the preferred language for creating Angular applications. We’ll cover what we need to as we go, and you’ll be fairly comfortable with it by the end of this chapter.

To get into it all, you’ll rebuild the list of locations shown in the homepage as an Angular application. You’ll embed this little application in the Express-driven homepage, replacing the list delivered by Express, to serve two purposes:

  • You’ll work with some of the building blocks of Angular without getting overwhelmed.
  • You’ll see how to use Angular to create a single component within an existing page or application.

Figure 8.1 shows where you are in the overall plan, adding Angular to the front end of the existing Express application.

Figure 8.1. This chapter focuses on adding Angular to the front end of the existing Express application

8.1. Getting up and running with Angular

8.2. Working with Angular components

8.3. Getting data from an API

8.4. Putting an Angular application into production

Summary

sitemap