Angular & Nest, a match made in heaven

How to generate a frontend and backend application with 5 commands

Offering many out of the box solutions for complex use-cases, Angular is one of the best frameworks for developing single-page applications. Another great thing about Angular is that it’s very opinionated about architecture. This is especially important for bigger development teams since it facilitates the on-boarding of new members and communication between different teams throughout an organization.

The Angular CLI (command line interface) is another amazing tool. It allows us to scaffold an entire Angular application with one command and perform common tasks such as extending, linting, testing, and building our application.

Nest JS, on the other hand, is a framework to develop backend applications with TypeScript. It's based on express JS. If you never heard of Nest JS, I recommend you to check out this article:

Step up your game, start using Nest!

Here’s the cool thing. Nest is deeply inspired by Angular. It offers out of the box solutions for many problems, comes with the same architectural building blocks and a similar command-line interface.

This similarity makes it very easy for Angular developers to implement backend features. You can apply the same principles from the backend to the frontend. Let’s take a closer look by learning a handful of commands to build an Angular app with a Nest JS backend.

What we are going to build

Since I am a big fan of the best football team in the world, we are going to build a small application that displays players from Real Madrid. Yes, Real Madrid is the best team, not Barcelona 😉.

The Angular app will fetch data over REST from a Nest backend and display them.