A JavaScript library for architecting user interfaces with RxJS and React.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
examples
media
packages
.gitignore Example: Word count (#32) Jun 1, 2018
.npmrc
CONTRIBUTING.md
LICENSE.md
README.md
config.js Prep for 0.5.0 release (#11) Jan 29, 2019
lerna.json
package-lock.json Prep for 0.5.0 release (#11) Jan 29, 2019
package.json

README.md

Conduit

Conduit provides a light set of utilities on top of a reactive library (RxJS) and a UI rendering library (React) to support efficient and scalable front-end application architectures.

Contents

  1. Contributing guidelines
  2. Installation and usage
  3. Building and testing
  4. Background
  5. Further reading
  6. Similar projects
  7. Contributors

Installation and usage

Conduit is composed of two primary packages. Refer to these packages for specific installation and usage.

So far, Conduit only supports React, but further packages could be developed as needed to support other rendering libraries.

Review examples for how to get started.

Building and testing

Install dependencies for this repo, for child packages, and for examples. Then build bundles.

npm run start

Background

Applications serve three primary purposes: input data, process data, and output data. For dynamic web applications, data input and output occurs in HTML, while data processing occurs in JavaScript.

Virtual DOM libraries, such as Facebook's React, help to normalize the complexities involved with updating HTML in different browser environments, while giving developers a more declarative way to define changes according to different input.

As for data processing and data flow, the JavaScript community has shifted toward a unidirectional architecture, as opposed to a bidirectional architecture, as championed by AngularJS since 2010. Within this new paradigm, there are quite a few popular architectures, each with their own advantages and disadvantages. Reflux simplified many concepts originally proposed by the Flux architecture. But a common contemporary pairing with React is Redux.

Redux is conceptually simple. Actions trigger Reducers to alter a single Store, which provides all the state needed for components to render. Redux itself is very small at its core. It organically grows by abstracting reusable code into boilerplate functions. It provides applications flexibility to include third party Middleware, to handle behaviors such as Ajax requests, timers, undo, and pagination.

The synchronous nature of Redux is insufficient to handle the future of web applications. Modern applications must manage interactions with a vast ecosystem of users, servers, and devices, all of which will occur at their own timing. By evidence of Redux Middleware, asynchronous behavior is an enhancement to an application, rather than something the application inherently embodies. In contrast, if Redux was asynchronous by nature, synchronous behavior would be innate. While Redux as a tool is lacking, Redux as a pattern is worth emulating.

If using a tool like RxJS, the Redux pattern can be replicated with minimal effort, while providing much more power to solve complex asynchronous problems. RxJS is a general-purpose reactive library which provides the majority of tools needed to manipulate and manage events and values over time. RxJS is one of the most popular and active reactive libraries available, alongside bacon.js, kefir, and xstream. However, unlike other libraries, because it is part of the cross-platform ReactiveX library family, a developer learning RxJS can use familiar APIs to develop with RxJava. RxJS was originally published by Microsoft in 2013, and now it is managed as an open source project, with Netflix being a primary contributor. One of the major goals of RxJS v5 is to align its API with the ES7 Observable spec, meaning it actively positions itself for the future of the JavaScript language.

There are several JavaScript frameworks built for reactive architectures, but they package a custom non-general purpose reactive library under the hood (Cerebral, MobX), assume a non-React VirtualDOM (Cycle.js), or require a high-level language which compiles down to JavaScript (Elm). By understanding these and other unidirectional architectures, a simple set of RxJS/React utilities can be created to support recommended architecture patterns, which will be more future-friendly, adaptable, and maintainable than a custom or existing framework. These utilities could eventually be generalized to work with any reactive library or any virtual DOM library.

Further reading

Similar projects

Contributors