title: React + Redux Example. Object are not valid as a React child
body: <p>I am having trouble getting a simple React and Redux example working and need some help please. I am receiving the following error as soon as I attempt to dispatch the incrementNumber action. I will paste my code in below. <a href="https://github.com/gabrielruss/redux-gabriel1" rel="nofollow noreferrer">Or you can use the Github link here.</a> Thanks in advance!</p>
  
  <p><a href="https://i.stack.imgur.com/QYP99.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QYP99.png" alt="enter image description here"></a></p>
  
  <p>index.js (App root)</p>
  
  <pre><code>import React from 'react';
  import { render } from 'react-dom';
  import { Provider } from 'react-redux';
  import store from './store/configureStore';
  
  import App from './containers/App';
  
  render(
      &lt;Provider store={store}&gt;
          &lt;App /&gt;
      &lt;/Provider&gt;,
      document.getElementById('root')
  );
  </code></pre>
  
  <p>configureStore.js</p>
  
  <pre><code>import { createStore } from 'redux';
  import rootReducer from '../reducers';
  
  export default createStore(rootReducer);
  </code></pre>
  
  <p>index.js (root reducer)</p>
  
  <pre><code>import { combineReducers } from 'redux';
  import numbersReducer from './numbersReducer';
  
  const rootReducer = combineReducers({
      number: numbersReducer
  });
  
  export default rootReducer;
  </code></pre>
  
  <p>numbersReducer.js</p>
  
  <pre><code>import initialState from './initialState';
  
  export default function numbersReducer(state = initialState.number, action) {
      switch (action.type) {
          case "INCREMENT_NUMBER":
              return { ...state, number: state.number + 1 }
          default:
              return state;
      }
  }
  </code></pre>
  
  <p>initialState.js</p>
  
  <pre><code>export default {
      number: 0
  }
  </code></pre>
  
  <p>App.js</p>
  
  <pre><code>import React from 'react';
  import { connect } from 'react-redux';
  import { incrementNumber } from '../actions/appActions';
  
  export class App extends React.Component {
  
      componentDidMount() {
          this.props.dispatch(incrementNumber(1));
      }
  
      render() {
          return (
              &lt;div&gt;
                  Current number: {this.props.number}
              &lt;/div&gt;
          );
      }
  }
  
  const mapStateToProps = state =&gt; ({
      number: state.number
  });
  
  export default connect(mapStateToProps)(App);
  </code></pre>
  
  <p>appActions.js</p>
  
  <pre><code>export function incrementNumber(number) {
      return { type: "INCREMENT_NUMBER", number}
  }
  </code></pre>