@rx-angular/state

@rx-angular/state

Reactive Component State for Angular

RxState is a light-weight, flexible, strongly typed and tested tool dedicated to reduce the complexity of managing component state in angular.

Description

Developing modern, reactive user interfaces imposes a variety of challenging tasks. Naming some of those:

• reacting to events from different sources
• transforming and composing state
• handling state lifetime
• handling subscriptions

There are plenty of solutions available for managing these challenges on a global level (Akita, NgRx, NgXs, ...). None of them targeting the special needs of the component level.

@rx-angular/state was specifically designed to give developers a tool for mastering component state without forcing them to use complex design patterns.

It's light-weight and intuitive API and the automatic subscription handling making @rx-angular/state the perfect fit for handling state in any angular component.

Using this library allows you to implement things like:

• merge global into local state
• shared state selections
• subscription-less interaction
• hook into imperative functions (e.g. component lifecycle or HostBindings)

with very little effort in any component.

Key features

• Slim, on point and intuitive API
• Automated subscription handling
• Connecting any Observable source to the state
• Partial state updates
• Reactive state selection
• Lazy state
• Foundation for zone-less Angular applications

Install

npm install @rx-angular/state

API

API Documentation

Usage

Usage Documentation

Demo

• Basic Tutorial
• Counter - StackBlitz

Snippets

• Logic comparison
• Loading state and data fetching
• Passing Observables

Demos/Tutorials

• Migrate to reactive components with @rx-angular/state
• Dynamic Counter Demo

Resources

Videos

• 🎥 Tackling Component State Reactively (Live Demo at 24:47)

Articles

• 💾 Research on Reactive Ephemeral State

Design Documents

• 💾 Design Documents Usage in the wild
• Fully-reactive Zone-Less Angular/Ionic Progressive Web Application by Mike Hartington