Resource Edit Lab
The Resource Edit lab experiments with an HTML and mobile first take on the MODX 2.x Resource Edit page. Thus far, the lab has been written HTML first and progressively enhanced with React + Redux. It would be great to enhance it with other frameworks, or "drivers" such as AngularJS as well.
The React + Redux proof can be accessed at:
http://jpdevries.github.io/matboard/labs/resource-edit/
Notice as you interact with the form the console logs the current state of the store.
- Accessible
- Lightweight (CSS + JS is less than 8kb over GZIP excluding CDN requests)
- HTML–first
- React + Redux 0.15
- Two Way Data Binding
- React
- ReactDOM
- Redux
- React Redux
- Internationalization
- Tests
- a11y audit
- Mirrored Calls to Action
- AngularJS Driver?
- VanillaJS Driver?
This was my first time using Redux and I love it. It took some time to understand the fundamental concepts of using a store with reducers and actions but once it clicks, a new super power is unlocked. React + Redux allows us to hook our views up to the database with two–way data binding while maintaining complete creative freedom over our views.
Currently there is some duplication with the markup being in index.html as HTML first as well as in the React JSX. If powered by a Node backend index.html could be authored using those same React components.