JSFiddle - React, Tailwind, and code Playground
by IPWright83
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.5.2/redux.js"></script>
<script src="https://rawgit.com/IPWright83/Postman-Jasmine/master/postman-jasmine.js"></script>
<script src="https://fb.me/react-0.14.0.js"></script>
<script src="htts://fb.me/react-dom-0.14.0.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>
<div id="root"></div>
JavaScript
Object.assign({}, todo, {
completed: !todo.completed
});
const counter = (state = 0, action) => {
switch(action.type) {
case "INCREMENT":
return state + 1;
case "DECREMENT":
return state - 1;
default:
return state;
}
};
const Counter = ({
value, onIncrement, onDecrement
}) => (
<h1>{value}</h1>
<button onClick={onIncrement}>+</button>
<button onClick={onDecrement}>-</button>
);
const { createStore } = Redux;
const store = createStore(counter);
log(store.getState());
store.dispatch({ type: 'INCREMENT' });
log(store.getState());
const render = () => {
ReactDOM.render(
<Counter value={store.getState()}
onIncrement={() => store.dispatch({ type: "INCREMENT" })}
onDecrement={() => store.dispatch({ type: "DECREMENT" })}
/>, document.getElementById('root')
)
};
store.subscribe(render);
render();
document.addEventListener("click", () => {
store.dispatch({ type: 'INCREMENT' })
});