Get Started with urx

urx is a JS toolkit for UI state management based on the the reactive programming paradigm. urx ships a set of reactive utilities – streams, actions, transformers and operators. Streams and their relationships are organized in systems and subsystems. Stream systems are exposed as React components, connecting its streams to properties, methods, events, and hooks for child components.

urx by Example

As a practical start, the section leads you through building a simple sum React component with urx backend.

Streams

Streams are the basic building blocks of a reactive system. Understanding their principles and the implementation provided by urx.

Piping and Operators

Transforming the output of stream(s) into other streams is what most of your code will be. In this section, we focus on how pipe works and what operators do.

Transfomers

Similar to operators, transformers are utilities which operate on multiple streams. Learn how to use combineLatest and merge.

Systems

The section explains systems on a conceptual level and how they are applied to real world problems. Next, we cover the system factory function, how to init systems, and how multiple systems can be organized into dependencies.

urx in React

React-urx implements systemToComponent function that wraps urx systems as logic provider React components, mapping streams to properties and hooks.

urx for Redux Developers

Spoiler alert - the two don't have much in common. This section gives a very loose mapping between the Redux concepts and the way urx works.

urx for RxJS Developers

Familiar with RxJS? Read this section first. This section compares the two libraries and maps common concepts from RxJS to their urx counterparts.