connected_component.jsx

import React from 'react';
import ReactDOM from 'react-dom';
import Redux from 'redux';
import { createStore } from 'redux';
import { connect, Provider } from 'react-redux';

class MyComponent extends React.Component {
  render() {
    const { active, toggle } = this.props;
    
    return (
      <div>
        <h1>Hello World</h1>
        <button onClick={toggle}>click me</button>
        <div>{active}</div>
      </div>
    )
  }
}

const someReducer = (state = { active: false }, action) => {
switch (action.type) {
  case 'TOGGLE':
  return {
    active: !state.active
  }
  default:
  return state
  }
}

const store = createStore(someReducer);

const mapStateToProps = function(store) {
  return {
    active: store.active
  };
}

const mapActionsToProps = {
  toggle: () => ({type: 'TOGGLE'})
};

connect(mapStateToProps, mapActionsToProps)(MyComponent);


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