04Progressive Web App

Reactive architecture with Signals

Modern Angular 19 architecture: standalone components, end-to-end Signals, and NgRx SignalStores scoped per feature route. Real-time updates via SignalR, fully internationalized, and deployed to iOS and Android through a single Ionic and Capacitor build.

Jump to Code

ANGULAR 19 · IONIC 8 · CAPACITOR 7master

Loading…

Principles

Signals end-to-end
NgRx Signal Stores per feature, computed for derived state, and patchState for updates. Reducing RxJS complexity where Signals provide a cleaner declarative approach.
Standalone, lazy by default
No NgModules. Every route uses loadComponent; feature stores and services are route-scoped providers, instantiating exactly where needed and garbage-collected with the route.
One reactive layer for HTTP and WebSocket
Functional authInterceptor attaches the JWT, ApiUtilsService unwraps Result<T> from the backend and handles 429 centrally. SignalR receives messages and pushes them straight into the HubStore — components stay declarative.
Mobile-native from web
Capacitor 7 wraps the same Angular build into Android and iOS targets, with the native projects checked into the repo. ngx-translate covers EN / ES / IT, with Ionic 8 components and a dark theme out of the box.

Stack

Angular 19Ionic 8Capacitor 7TypeScript 5.6NgRx SignalsStandalone ComponentsSignalR ClientRxJS 7Reactive FormsFunctional GuardsHTTP InterceptorsRoute-Scoped DILazy LoadingSwiperngx-translateESLint 9Prettier 3Dark Themei18n EN / ES / ITInfinite ScrollCapacitor Plugins