JSFiddle - React, Tailwind, and code Playground

by Lumina Scheiderich

HTML

<script src="https://unpkg.com/react@latest/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://unpkg.com/recompose/build/Recompose.js"></script>
<div id="container">
  <!-- This element's contents will be replaced with your component. -->
</div>

Babel + JSX

const { withStateHandlers } = Recompose;

const Counter = ({ count, increment, decrement }) =>
  <div>
    Count: {count}
    <div>
      <button onClick={increment}>+</button>
      <button onClick={decrement}>-</button>
    </div>
  </div>;

const App = withStateHandlers(
  {
    count: 0
  },
  {
    increment: ({ count }) => () => ({ count: count + 1 }),
    decrement: ({ count }) => () => ({ count: count - 1 })
  }
)(Counter);

ReactDOM.render(<App />, document.getElementById("container"));