pure-react
Wrapper for React to write code in more elegant, functional style and speed up development.
Built-in State Control, so you don’t need redux/mobx anymore.
Installation
yarn add pure-react
or
npm i pure-react --save
Basic usage
const view text = let style = ... const app =
Documentation
### Updates Controls app state.
All you need is add {id: '...'}
to component props and then update.do(id)
to make update.
const update view button text = const app = { let state = counter: 0 return }
Add prop {from: '...'}
for partial updates.
For example, you have component 'header' with childs 'name', 'ready', 'score', 'notification', etc.
const header =
Now, you can update full group by update.do('header')
or partially update.do('header', ['ready', 'score'])
Life-cycle:
update.do(id, [from])
update //update full group update // update some of group
update.list
console // Array of subscribers
### Store Global object for your application.
const store text = storesettings = ... storeuser = ... storeversion = ... const app =
### Components All React components and apis available in lowercase.
view(style, props, children)
if you haven't props, just use view(style, children)
//or div
button(children, style, props)
or button(style, props, children)
text(children, style, props)
//or p
textinput(style, props)
//or textarea
image(style, props)
//or img
...
component(style, props, children)
or component(props)
## Example
const react update view text button = const style = wrap: width: '100vw' height: '100vh' display: 'flex' flexDirection: 'column' alignItems: 'center' justifyContent: 'center' scenes: display: 'flex' flexDirection: 'row' width: 150 height: 240 margin: 5 display: 'flex' alignItems: 'center' justifyContent: 'center' backgroundColor button: margin: 5 color: 'blue' const counter = const scene = const scenes = const handle = const testapp = { let state = counter: 0 return } Component