Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/voronianski/flux-comparison
:pencil: Practical comparison of different Flux solutions
https://github.com/voronianski/flux-comparison
Last synced: 7 days ago
JSON representation
:pencil: Practical comparison of different Flux solutions
- Host: GitHub
- URL: https://github.com/voronianski/flux-comparison
- Owner: voronianski
- Created: 2015-01-24T17:38:24.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2020-06-15T15:28:31.000Z (over 4 years ago)
- Last Synced: 2024-10-29T17:57:08.921Z (about 1 month ago)
- Language: JavaScript
- Homepage: https://labs.voronianski.dev/flux-comparison/
- Size: 1.86 MB
- Stars: 2,786
- Watchers: 91
- Forks: 214
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
- awesome-flux - Flux Comparison
README
# Flux Comparison by Example
> Similar app implemented with different [Flux](https://facebook.github.io/flux/) solutions including Facebook's, Yahoo's and others.
[](http://pixelhunter.me/post/110248593059/flux-solutions-compared-by-example)
## Usage
Clone this repo and run `npm install` inside it.
Before checking any of the included solutions you will need to:
0. Go to solution folder (e.g. `cd facebook-flux`, `cd redux`, etc.)
1. Run `npm install` to install dependencies of a specific app
2. Run `npm start` to build js resources with [Browserify](http://browserify.org)
3. Open `index.html` in the browser
## Demo
Select several products from _Flux Online Shop_ and add them to cart. Open browser console and click _Checkout_ button, you'll see payload with products that you just "bought".
[](http://labs.voronianski.dev/flux-comparison)
http://labs.voronianski.dev/flux-comparison
**You may find few notes about all implementations on my [blog](http://pixelhunter.me/post/110248593059/flux-solutions-compared-by-example).**
Discussion on HackerNews - https://news.ycombinator.com/item?id=8989495.
## Examples
The list of Flux related implementations used in this demo.
### Ready
* [x] [Facebook Flux](https://github.com/voronianski/flux-samples/tree/master/facebook-flux)
* [x] [Fluxible by Yahoo](https://github.com/voronianski/flux-samples/tree/master/yahoo-fluxible)
* [x] [Reflux](https://github.com/voronianski/flux-samples/tree/master/reflux)
* [x] [Alt](https://github.com/voronianski/flux-samples/tree/master/alt)
* [x] [Flummox](https://github.com/voronianski/flux-samples/tree/master/flummox)
* [x] [Marty.js](https://github.com/voronianski/flux-samples/tree/master/marty)
* [x] [McFly](https://github.com/voronianski/flux-samples/tree/master/mcfly)
* [x] [Lux](https://github.com/voronianski/flux-comparison/tree/master/lux)
* [x] [Material Flux](https://github.com/voronianski/flux-comparison/tree/master/material-flux)
* [x] [Redux](https://github.com/voronianski/flux-comparison/tree/master/redux)
* [x] [Redux + Flambeau](https://github.com/voronianski/flux-comparison/tree/master/redux-flambeau)
* [x] [Nuclear.js](https://github.com/voronianski/flux-comparison/tree/master/nuclear-js)
* [x] [Fluxette](https://github.com/voronianski/flux-comparison/tree/master/fluxette)
* [x] [Fluxxor](https://github.com/voronianski/flux-comparison/tree/master/fluxxor)
* [x] [Freezer](https://github.com/voronianski/flux-comparison/tree/master/freezer-js)
* [x] [Fluxury](https://github.com/voronianski/flux-comparison/tree/master/fluxury)
### Next
_You're welcome to create [issues](https://github.com/voronianski/flux-comparison/issues) with suggestions or even make your own [pull-requests](https://github.com/voronianski/flux-comparison/pulls) (but before please take a look on [contributing guidelines](https://github.com/voronianski/flux-comparison/blob/master/CONTRIBUTING.md))._
## Resources
### Libraries
- https://github.com/facebook/flux
- http://fluxible.io
- https://github.com/spoike/refluxjs
- https://github.com/goatslacker/alt
- https://github.com/kenwheeler/mcfly
- https://github.com/acdlite/flummox
- https://github.com/LeanKit-Labs/lux.js
- https://github.com/azu/material-flux
- http://martyjs.org
- https://github.com/gaearon/redux
- https://github.com/BurntCaramel/flambeau
- https://optimizely.github.io/nuclear-js
- https://github.com/edge/fluxette
- https://github.com/BinaryMuse/fluxxor
- https://github.com/arqex/freezer
- https://github.com/FunctionFoundry/fluxury
### Articles
- http://facebook.github.io/react/blog/2014/07/30/flux-actions-and-the-dispatcher.html
- http://www.code-experience.com/async-requests-with-react-js-and-flux-revisited
- http://spoike.ghost.io/deconstructing-reactjss-flux
- https://medium.com/@dan_abramov/the-evolution-of-flux-frameworks-6c16ad26bb31
### Non React.js examples
The [flux demo app](http://labs.voronianski.dev/flux-comparison/) was also implemented by enthusiasts without React.js but with another view layer:
* [Riot + RiotControl](https://github.com/txchen/feplay/tree/gh-pages/riot_flux)
* [flux-riot demo](https://github.com/mingliangfeng/flux-riot-demo)
* [idom-redux-todomvc-app (incremental-dom + redux)](https://github.com/joshthecoder/idom-redux-todomvc-app)
* [Polymer with Reflux](https://github.com/devinivy/polymer-funky-flux)
* [Vuex](https://github.com/vuejs/vuex/tree/master/examples/shopping-cart)
* [@ngrx: Redux implemention for Angular](https://github.com/ngrx/platform)
## Contributing
See [CONTRIBUTING.md](https://github.com/voronianski/flux-comparison/blob/master/CONTRIBUTING.md).
---
**MIT Licensed**