fluorine - [UNMAINTAINED] Reactive state and side effect management for React using a single stream of actions

  •        21

Flexible state and side effect manager using RxJS for React. Fluorine provides you with easy, reactive state and side effect management, accumulating stores from streams of actions and side effects.

https://fluorinejs.org/
https://github.com/kitten/fluorine

Dependencies:

babel-core : ^6.18.2
rxjs : ^5.2.0
symbol-observable : ^1.0.4

Tags
Implementation
License
Platform

   




Related Projects

akita - 🚀 State Management Tailored-Made for JS Applications

  •    TypeScript

Whether it be Angular, React, Vue, Web Components or plain old vanilla JS, Akita can do the heavy lifting and serve as a useful tool for maintaining clean, boilerplate-free, and scalable applications. Akita is a state management pattern, built on top of RxJS, which takes the idea of multiple data stores from Flux and the immutable updates from Redux, along with the concept of streaming data, to create the Observable Data Stores model.

dutier - The immutable, async and hybrid state management solution for Javascript applications.

  •    Javascript

The 2kb immutable, async and universal state management solution for Javascript applications. It evolves on the ideas of Redux.

moreartyjs - Morearty.js - centralized state management for React in pure JavaScript

  •    Javascript

Morearty.js is a thin layer on top of React (implemented as a mixin) providing better state management facilities in the manner of Om but written in pure JavaScript. Underneath, Morearty leverages immutable data structures, provided by Facebook's Immutable library, which hold the state of an application. That state is described by a single Binding object and all state transitions are performed through it. When an application component needs to delegate a part of its state to a sub-component, it can create a sub-binding which points to a nested location within the global state and is fully synchronized with the original binding. This way every component knows only what it should know and the entire state is effectively encapsulated. Morearty detects any changes automatically and triggers re-rendering. Moreover, each component gets a correctly defined shouldComponentUpdate method that compares the component's state using straightforward JavaScript strict equals operator ===. So, only the components whose state was altered are re-rendered.

focal - Program user interfaces the FRP way.

  •    TypeScript

Type safe, expressive and composable state management for React applications. You can play with this example online on CodeSandbox.

redux - Predictable state container for JavaScript apps

  •    Javascript

It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time traveling debugger.You can use Redux together with React, or with any other view library. It is tiny (2kB, including dependencies).


redux - Predictable state container for JavaScript apps

  •    Javascript

It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time traveling debugger. You can use Redux together with React, or with any other view library. It is tiny (2kB, including dependencies).

rx-react - ReactJS bindings for RxJS

  •    Javascript

The StateStreamMixin allows to bind a component state to an RxJS Observable stream. The way to achieve the binding is to provide a getStateStream method on your component that returns an RxJS Observable, the StateStream mixin will automatically merge the state of your component with the values published by the returned observable. The subscription will be automaticly cleaned on component unmount. The LifecycleMixin allows you to consume React components lifecycle events as RxJS Observable. The LifecycleMixin will inject a property lifecycle to the component, that property contains an observable for each lifecycle events.

react-cursor - Immutable state for React.js

  •    Javascript

Cursors are a tool for working with recursive or deeply nested data, immutably. react-cursor is a javascript port of an abstraction that I first saw in ClojureScript. This implementation is decoupled from any rendering library and is very small. Cursors are useful in UI programming, because UIs are tree shaped and naturally have tree-shaped state. Cursors let your app hold all its state in one place at the root of the UI tree; thus the root is stateful, and all downtree views are stateless.

rx-flux - The Flux architecture with RxJS

  •    Javascript

The Flux architecture allows you to think your application as an unidirectional flow of data, this module aims to facilitate the use of RxJS Observable as basis for defining the relations between the different entities composing your application. This package is still highly experimental, see #10. Until it's finalized and published, use git url to install it with npm.

freezer - A tree data structure that emits events on updates, even if the modification is triggered by one of the leaves, making it easier to think in a reactive way

  •    Javascript

A tree data structure that emits events on updates, even if the modification is emited by one of the leaves, making it easier to think in a reactive way. Are you looking for an immutable.js alternative? Freezer is made with React.js in mind and it uses real immutable structures. It is the perfect store for you application.

redux-machine - A tiny library (12 lines) for creating state machines in Redux apps

  •    Javascript

If you are using Immutable JS in your stores, see redux-machine-immutable. redux-machine internally uses Object.assign, which is an ES2015 feature. If you need to support older browsers, you can use a polyfill such as core-js.

derivablejs - Functional Reactive State for JavaScript and TypeScript

  •    Javascript

Derivables are an Observable-like state container with superpowers. Think MobX distilled to a potent essence, served with two heaped tablespoons of extra performance, a garnish of declarative effects management, and a healthy side-salad of immutability. Atoms are simple mutable references to immutable values. They represent the ground truth from which all else is derived.

undux - ⚡️ Dead simple state management for React

  •    TypeScript

Be sure to define a key for each value in your model, even if the value is initially undefined. That's all there is to it.

react-copy-write - ✍️ Immutable state with a mutable API

  •    Javascript

An immutable React state management library with a simple mutable API, memoized selectors, and structural sharing. Powered by Immer. Check out this small demo.

redux-react-local - local component state via redux

  •    Javascript

Add the supplied reducer to a key local on your redux store. However, because 'views' don't have global references / identities ala Backbone etc, communicating between these components can get cumbersome 2; we then resort to building some form of messaging system external to these components - callbacks, pubsub channels, flux stores, observable event chains, etc. The smart ones use context to expose these systems to a particular render tree, avoiding 'global' state, but still getting a similar model.

immer - Create the next immutable state by mutating the current one

  •    Javascript

Immer (German for: always) is a tiny package that allows you to work with immutable state in a more convenient way. It is based on the copy-on-write mechanism. The basic idea is that you will apply all your changes to a temporarily draftState, which is a proxy of the currentState. Once all your mutations are completed, Immer will produce the nextState based on the mutations to the draft state. This means that you can interact with your data by simply modifying it, while keeping all the benefits of immutable data.

redux-connect - Provides decorator for resolving async props in react-router, extremely useful for handling server-side rendering in React

  •    Javascript

How do you usually request data and store it to redux state? You create actions that do async jobs to load data, create reducer to save this data to redux state, then connect data to your component or container. Usually it's very similar routine tasks.

marty - A Javascript library for state management in React applications

  •    Javascript

Marty is a Javascript library for state management in React applications. It is an implementation of the Flux architecture. A TypeScript definition is available at marty.d.ts. Please note that it requires the React definition from DefinitelyTyped.

re-base - :fire: A Relay inspired library for building React.js + Firebase applications. :fire:

  •    Javascript

React.js makes managing state easy to reason about. Firebase makes persisting your data easy to implement. re-base, inspired by Relay, combines the benefits of React and Firebase by allowing each component to specify its own data dependency. Forget about your data persistence and focus on what really matters, your application's state. I spent a few weeks trying to figure out the cleanest way to implement Firebase into my React/Flux application. After struggling for a bit, I tweeted my frustrations. I was enlightened to the fact that Firebase and Flux really don't work well together. It makes sense why they don't work together, because they're both trying to accomplish roughly the same thing. So I did away with my reliance upon Flux and tried to think of a clean way to implement React with Firebase. I came across ReactFire built by Jacob Wenger at Firebase and loved his idea. Sync a Firebase endpoint with a property on your component's state. So whenever your data changes, your state will be updated. Simple as that. The problem with ReactFire is because it uses Mixins, it's not compatible with ES6 classes. After chatting with Jacob Turner, we wanted to create a way to allow the one way binding of ReactFire with ES6 classes along some more features like two way data binding and listening to Firebase endpoints without actually binding a state property to them. Thus, re-base was built.

constate - Scalable state manager using React context

  •    TypeScript

React state management library built with scalability in mind. You can start simple with local state and scale up to global state with ease when needed. In computer science, a container is a class, a data structure, or an abstract data type (ADT) whose instances are collections of other objects. In other words, they store objects in an organized way that follows specific access rules.