Recipes – Reusability, Forms, and Caching

In the next two chapters, we will complete most of the implementation of LemonMart and round out our coverage of the router-first approach. In this chapter, I will reinforce the idea of a decoupled component architecture by creating a reusable and routable component that supports data binding. We will use Angular directives to reduce boilerplate code and leverage classes, interfaces, enums, validators, and pipes to maximize code reuse with TypeScript and ES features.

In addition, we will create a multi-step form that architecturally scales well and supports a responsive design. Then, we will differentiate between user controls and components by introducing a lemon rater and a reusable form part that encapsulates the name object.

This chapter covers a lot of ground. It is organized in a recipe format, so you can quickly refer to a particular implementation when working on your projects. I will cover the implementations’...