Ideas for sharing Angular and NGRX feature modules between multiple applications. This project is a work in progress, and I welcome any feedback
Identifying a good solution for creating ngrx stores and angular feature modules with ngrx feature stores that can be shared across multiple angular applications without creating lots of maintainance work and compatability issues between apps.
Creating a mono-repo that contains:
- "shared-core" providers / classes - core items for an angular application like the root ngrx store and actions
- feature modules - modules and ngrx feature stores providing a "cohesive set of functionality focused on a specific application need" that can include different effects for loading data in different environments (online / offline)
- library modules - collections of components and services providing reusable functionality
- application modules - Angular applications with effects for loading data. *In this demo project each of the two applications has effects for loading data differently, but these could be moved to the shared core so any application could pick between different data sources for populating the store.
This allows:
- a single base store to be shared across multiple applications.
- feature modules with feature stores and access to the interface of the core store
- the ability to use different effects in different applications to populate the store from different data sources. e.g a web app might have a HTTP SDK effect to populate the store from the server, but hybrid mobile app might populate the store from a local SQL database that is periodically synched with the server.
- Rapid development of new applications using these building blocks
| Folder | Description |
|---|---|
| src/* | The main angular application generated by the cli. This is not used as part of this project. |
| shared core | A core ngrx store and actions that are shared between the web and mobile apps |
| projects/web-app | An angular application with an effect that populates the root store |
| projects/mobile-app | Another angular application an effect that populates the root store |
| projects/feature-module/src/lib | An angular component with a feature store. There are two sets of effects for the store (one for each app type) exposed via a different module for each app type to import. |
The next problem to address is building and deploying from this structure. A few initial thoughts:
- Rebuilding every app and feature module for every build would help reduce compatability issues caused by changes to feature modules / shared components, but would drastically increase build times.
- A smart build that only builds the project that has been updated would keep the build time down, but leave the risk of compatability issues between projects (e.g. modifying the shared core and only updating 1 application that depends on it)
- Separating the projects inside this repo to completely separate projects with separate builds could allow more flexability for different apps working with different versions of the shared core / feature modules, but this would make development more complicated and could lead to issues where different applications are dependant on vastly different version of the shared core / feature modules.