React-MVx
React-MVx is the MVVM SPA framework with React as View layer, built upon frontend technologies used at Volicon/Verizon for 3 years.
Contrary to the popular React approaches, React-MVx does not try to avoid the distributed mutable application state. Instead, it is focused on bringing stateful components capabilities to their maximum.
React-MVx manages both local UI state and application domain state with the same universal state container provided by Type-R data framework. It supports:
- two-way data binding
- declarative state validation
- nested data structures & observable changes
- painless state synchronization
- automatic JSON serialization
React-MVx application architecture follows scalable MVVM architecture pattern. It features the unidirectional data flow and pure render optimization. But contrary to the popular React state management solutions:
- It doesn't rely on singletons (unless you really need some data to be shared across pages)
- It assists and encourages usage of locally encapsulated state and OO decomposition.
Examples
- Checklist tree(source)
- TodoMVC(source)
- UsersList(source)
- Flux Comparison(source)
- Babel + Webpack boilerplate(source)
Documentation
Start there.
More tutorials to come.
Installation & Requirements
Supported browsers: Chrome, Firefox, Safari, IE10+.
Requires react and type-r as peer dependencies. Installation (assuming that React is installed):
`npm install react-mvx type-r --save-dev`
The best way to start is to use the boilerplate which already has babel, webpack 2, and minimal set of required dependencies configured.
TypeScript is unsupported (yet) but may work.
MIT License. Used and supported by Volicon and Verizon Digital Media Services.