Why should you care?

Without a plan, each feature caches its own copy of tenant settings and goes stale.

See it live — copy this example

Paste into your MeanVerse project (Angular + Express + MongoDB), then run with ng serve / node / mongosh as noted.

// NgRx feature slice (simplified)
export const accountsFeature = createFeature({
  name: 'accounts',
  reducer: createReducer(
    initialState,
    on(AccountsActions.loadSuccess, (state, { accounts }) => ({ ...state, accounts, loading: false }))
  )
});
// selector
export const selectActiveAccounts = createSelector(
  selectAccountsState,
  s => s.accounts.filter(a => a.active)
);

What happened?

• Actions describe events.
• Reducer returns new immutable state.
• Selectors memoize derived lists — components inject Store and use async pipe on selectActiveAccounts.

Practice next

1. Decide local (signal) vs global (NgRx) per state piece.
2. Model accounts slice: loading, error, entities.
3. Dispatch load action from resolver or component.
4. Add EntityAdapter for normalized account ids.
5. Mirror one slice with signal store experiment.

Remember

Pick state tool by scope and team skill. Global store for auth, tenant, feature flags. Local signals for form and UI ephemeral state.

Multi-tab SaaS

User updates billing plan in settings; header must refresh entitlements.

Outcome: Central store update reflects across all mounted components.