kosich/README.md

## README.md

      
    Raw
  

              README.md
            
          
    after listening to
https://egghead.io/courses/getting-started-with-redux

  
## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://fb.me/react-15.1.0.js"></script>
  <script src="https://fb.me/react-dom-15.1.0.js"></script>
  <script src="https://unpkg.com/redux@3.7.2/dist/redux.js"></script>
  <script src="https://unpkg.com/react-redux@5.0.5/dist/react-redux.js"></script>

</head>
<body>
  <div id="root"></div>
<script id="jsbin-javascript">
'use strict';

var _Redux = Redux;
var createStore = _Redux.createStore;
var _React = React;
var Component = _React.Component;
var _ReactRedux = ReactRedux;
var Provider = _ReactRedux.Provider;
var connect = _ReactRedux.connect;

var root = function root(state, action) {
  if (typeof state === 'undefined') {
    return 0;
  }

  if (action.type === 'INC') {
    return state + 1;
  } else if (action.type === 'DEC') {
    return state - 1;
  } else {
    return state;
  }
};

var App = connect(function (state) {
  return { state: state };
}, function () {})(function (_ref) {
  var state = _ref.state;

  return React.createElement(
    'div',
    null,
    React.createElement(Counter, { value: state }),
    React.createElement(Footer, null)
  );
});

var Footer = connect()(function (_ref2) {
  var dispatch = _ref2.dispatch;
  return React.createElement(
    'footer',
    null,
    React.createElement(
      'span',
      {
        onClick: function () {
          return dispatch({
            type: 'DEC'
          });
        }
      },
      'Decrement'
    ),
    React.createElement(
      'span',
      {
        onClick: function () {
          return dispatch({
            type: 'INC'
          });
        }
      },
      'Increment'
    )
  );
});

var Counter = function Counter(_ref3) {
  var value = _ref3.value;

  return React.createElement(
    'b',
    null,
    value
  );
};

ReactDOM.render(React.createElement(
  Provider,
  { store: createStore(root) },
  React.createElement(App, null)
), document.getElementById('root'));
</script>


<script id="jsbin-source-javascript" type="text/javascript">const { createStore } = Redux;
const { Component } = React;
const { Provider, connect } = ReactRedux;

const root = (state, action)=>{
  if (typeof state === 'undefined'){
    return 0;
  }

  if (action.type === 'INC'){
    return state+1;
  } else if (action.type === 'DEC') {
    return state-1;
  } else {
    return state;
  }
}

const App = connect(
  state=>({ state }),
  ()=>{}
)(({ state })=>{
    return (
      <div>
        <Counter value={ state } />
        <Footer />
      </div>
    );
  });


const Footer = connect()(({ dispatch })=>(
  <footer>
    <span
    onClick={
      ()=>dispatch({
        type: 'DEC'
      })
    }
    >Decrement</span>
    {  }
    <span
    onClick={
      ()=>dispatch({
      type: 'INC'
    })
    }
    >Increment</span>
  </footer>
));


const Counter = ({ value })=>{
  return <b>{ value }</b>;
}


ReactDOM.render(
  <Provider store={ createStore(root) }>
    <App />
  </Provider>,
  document.getElementById('root')
)

</script></body>
</html>

## jsbin.zigejas.js
'use strict';

var _Redux = Redux;
var createStore = _Redux.createStore;
var _React = React;
var Component = _React.Component;
var _ReactRedux = ReactRedux;
var Provider = _ReactRedux.Provider;
var connect = _ReactRedux.connect;

var root = function root(state, action) {
  if (typeof state === 'undefined') {
    return 0;
  }

  if (action.type === 'INC') {
    return state + 1;
  } else if (action.type === 'DEC') {
    return state - 1;
  } else {
    return state;
  }
};

var App = connect(function (state) {
  return { state: state };
}, function () {})(function (_ref) {
  var state = _ref.state;

  return React.createElement(
    'div',
    null,
    React.createElement(Counter, { value: state }),
    React.createElement(Footer, null)
  );
});

var Footer = connect()(function (_ref2) {
  var dispatch = _ref2.dispatch;
  return React.createElement(
    'footer',
    null,
    React.createElement(
      'span',
      {
        onClick: function () {
          return dispatch({
            type: 'DEC'
          });
        }
      },
      'Decrement'
    ),
    React.createElement(
      'span',
      {
        onClick: function () {
          return dispatch({
            type: 'INC'
          });
        }
      },
      'Increment'
    )
  );
});

var Counter = function Counter(_ref3) {
  var value = _ref3.value;

  return React.createElement(
    'b',
    null,
    value
  );
};

ReactDOM.render(React.createElement(
  Provider,
  { store: createStore(root) },
  React.createElement(App, null)
), document.getElementById('root'));
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>JS Bin</title>
	<script src="https://fb.me/react-15.1.0.js"></script>
	<script src="https://fb.me/react-dom-15.1.0.js"></script>
	<script src="https://unpkg.com/redux@3.7.2/dist/redux.js"></script>
	<script src="https://unpkg.com/react-redux@5.0.5/dist/react-redux.js"></script>

	</head>
	<body>
	<div id="root"></div>
	<script id="jsbin-javascript">
	'use strict';

	var _Redux = Redux;
	var createStore = _Redux.createStore;
	var _React = React;
	var Component = _React.Component;
	var _ReactRedux = ReactRedux;
	var Provider = _ReactRedux.Provider;
	var connect = _ReactRedux.connect;

	var root = function root(state, action) {
	if (typeof state === 'undefined') {
	return 0;
	}

	if (action.type === 'INC') {
	return state + 1;
	} else if (action.type === 'DEC') {
	return state - 1;
	} else {
	return state;
	}
	};

	var App = connect(function (state) {
	return { state: state };
	}, function () {})(function (_ref) {
	var state = _ref.state;

	return React.createElement(
	'div',
	null,
	React.createElement(Counter, { value: state }),
	React.createElement(Footer, null)
	);
	});

	var Footer = connect()(function (_ref2) {
	var dispatch = _ref2.dispatch;
	return React.createElement(
	'footer',
	null,
	React.createElement(
	'span',
	{
	onClick: function () {
	return dispatch({
	type: 'DEC'
	});
	}
	},
	'Decrement'
	),
	React.createElement(
	'span',
	{
	onClick: function () {
	return dispatch({
	type: 'INC'
	});
	}
	},
	'Increment'
	)
	);
	});

	var Counter = function Counter(_ref3) {
	var value = _ref3.value;

	return React.createElement(
	'b',
	null,
	value
	);
	};

	ReactDOM.render(React.createElement(
	Provider,
	{ store: createStore(root) },
	React.createElement(App, null)
	), document.getElementById('root'));
	</script>



	<script id="jsbin-source-javascript" type="text/javascript">const { createStore } = Redux;
	const { Component } = React;
	const { Provider, connect } = ReactRedux;

	const root = (state, action)=>{
	if (typeof state === 'undefined'){
	return 0;
	}

	if (action.type === 'INC'){
	return state+1;
	} else if (action.type === 'DEC') {
	return state-1;
	} else {
	return state;
	}
	}

	const App = connect(
	state=>({ state }),
	()=>{}
	)(({ state })=>{
	return (
	<div>
	<Counter value={ state } />
	<Footer />
	</div>
	);
	});


	const Footer = connect()(({ dispatch })=>(
	<footer>
	<span
	onClick={
	()=>dispatch({
	type: 'DEC'
	})
	}
	>Decrement</span>
	{ }
	<span
	onClick={
	()=>dispatch({
	type: 'INC'
	})
	}
	>Increment</span>
	</footer>
	));



	const Counter = ({ value })=>{
	return <b>{ value }</b>;
	}



	ReactDOM.render(
	<Provider store={ createStore(root) }>
	<App />
	</Provider>,
	document.getElementById('root')
	)

	</script></body>
	</html>