what is the design choice to follow with nrwl nx angular

Question

I am using nrwl Nx for my app developement. So far I have been following like this.

• Created separate library for my lazy loaded feature. eg: i have a news module where I have news add/delete/update features. This library has all the required services and routing.

• Loading the above library into my app does the job well.

Problem started after a while. - when I needed some of the component I used in the news library in other application which does not need the entire module. It needed one or two of the components.

• then I had to refactor those components to become dump by extracting out the service injection and the made @input for data.

Now I need to create new module. which does the same as above but for adding events/annoucements.

my query- should I follow the above mentioned way like news module

or the following way.

• create library with just components and services. Do not use the services in the library (inject to any component in the library).

• use the library service in the application and use the components from the library to display item by giving the required @Input.

• have all the routes and every other navigation handled in the application.

• so the library will just be a place to have all the components and services mentioned. nothing more..

I anybody gets what I am trying to say.. Which way would you prefer to proceed.

Answer 1

The general idea is for a library to focus on something specific. In your case it sounds like you need a few libraries:

• one that handles the routing for the lazy-loaded routes for a particular domain (the feature ) eg "customers"
• one for your dumb components (these can be nested inside folders like "customer" or "shared")
• one for data-access, which looks after API calls and state management in your domain (eg "customer" or "shared")

The main app should only set up the overall routing and nothing else. You can read Victor's article on this here: https://blog.nrwl.io/building-full-stack-applications-using-angular-cli-and-nx-5eff205248f1