The great part about Nx is that it supports the creation of Node.js applications via the use of Nest.js and Express. In Chapter 5, Building a PWA E-Commerce Application Using Angular Service Worker, we created a Nest.js application called es-api. Since we want to use an Nx workspace, which requires us to have all our applications in one repository, we will try to retrieve the es-api application without using our new Nx workspace, electronic-store.
Let's first add nest application capability to our application using the following command:
> ng add @nrwl/nest
Let's create a new node application using the Nx command, as follows:
> ng g @nrwl/nest:app es-api --frontendProject electronic-store
? In which directory should the node application be generated?
The fronendProject flag will add a proxy to the electronic-store app. We can use the API directly from our application.
Let's update the API URL in products.service.ts in the electronic-store app:
const PRODUCTS_API = '/api/products';
Now, let's copy and paste our es-api folder from the books repository, https://github.com/PacktPublishing/Angular-Projects/tree/master/Chapter08/electronic-store/apps/es-api.
> npm i express-jwt jwks-rsa @nestjs/[email protected] @nestjs/core5.5.0
Now, we can serve both applications using the Angular CLI command in two different Terminals:
> ng serve es-api
In a different Terminal, run the following command:
> ng serve electronic-store
Now, when you open http://localhost:4200 in a browser, you should see that our application works fine and that all the products are displayed.
Now that we have successfully created a monorepo with two existing applications, that is, electronic-store and es-api, we will create a new client application that will be used by admins to check the sales data.