A lot of things happened here. We turned our attention to the client-side components of our app, switching the focus from Web API to Angular. We chose to implement a Home View featuring multiple listings of clickable tests, giving our users the chance to navigate to their detail page through a classic Master-Detail relationship.

To achieve such results, we created a bunch of Angular-related items: the Quiz interface for the model, the QuizListComponent class to retrieve the required data from the .NET Core Controller and show them to the user, and the QuizComponent to access the detail of each selected quiz. We connected them all with the Angular native data-binding strategies and updated the HomeComponent accordingly; right after that, we improved the QuizListComponent by turning it into a versatile and reusable class so that we were able to add multiple instances of it into the HomeComponent template.

Everything we did was indeed working, but it didn’t reach our expectations in terms of seamless navigation between views. We chose to address this issue by refactoring our app and improving the implementation of the Angular Routing Module, thus improving our previous Master/Detail approach.

As soon as we built our improved, navigation-based pattern, we performed a final test to see whether everything was working as expected; since it did, we added other components, including a PageNotFoundComponent that will be shown to our users whenever they try to visit a non-existing route.

In the last section, we implemented a minimalistic, dummy-based, yet functional Web API using .NET Core MVC. In this chapter, we built an unpolished--yet working--Angular client-side App. In the subsequent chapters, we’ll address these flaws by adding a Data Model, further improving our controllers and also working on the frontend for a better UI.