title: Error: The root route must render a single element Re
body: <p>I am new all around React and i am trying to using a simple tutorial for login and signup. currently the server is up but in the browser i get the follwing erros and warnings:</p>
  
  <pre><code>    Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.
  Warning: RouterContext: React.createClass is deprecated and will be removed in version 16. Use plain JavaScript classes instead. If you're not yet ready to migrate, create-react-class is available on npm as a drop-in replacement.
   Uncaught Error: The root route must render a single element
  at invariant (app.js:1431)
  at Object.render (app.js:9338)
  at app.js:31715
  at measureLifeCyclePerf (app.js:30994)
  at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext (app.js:31714)
  at ReactCompositeComponentWrapper._renderValidatedComponent (app.js:31741)
  at ReactCompositeComponentWrapper.performInitialMount (app.js:31281)
  at ReactCompositeComponentWrapper.mountComponent (app.js:31177)
  at Object.mountComponent (app.js:4009)
  at ReactCompositeComponentWrapper.performInitialMount (app.js:31290)
  </code></pre>
  
  <p>i am not sure what is the problem,
  route.js:</p>
  
  <pre><code>    /**
   * Created by matant on 23/04/17.
   */
  import Base from './components/Base.jsx';
  import HomePage from './components/HomePage.jsx';
  import LoginPage from './containers/LoginPage.jsx';
  import SignUpPage from './containers/SignUpPage.jsx';
  
  
  const routes = {
      // base component (wrapper for the whole application).
      component: Base,
      childRoutes: [
  
          {
              path: '/',
              component: HomePage
          },
  
          {
              path: '/login',
              component: LoginPage
          },
  
          {
              path: '/signup',
              component: SignUpPage
          }
  
      ]
  };
  
  export default routes;
  </code></pre>
  
  <p>Base.jsx:</p>
  
  <pre><code> import React from 'react';
  import { Link, IndexLink } from 'react-router';
  import PropTypes from 'prop-types';
  
  const Base = ({ children }) =&gt; (
      &lt;div&gt;
          &lt;div className="top-bar"&gt;
              &lt;div className="top-bar-left"&gt;
                  &lt;IndexLink to="/"&gt;React App&lt;/IndexLink&gt;
              &lt;/div&gt;
  
              &lt;div className="top-bar-right"&gt;
                  &lt;Link to="/login"&gt;Log in&lt;/Link&gt;
                  &lt;Link to="/signup"&gt;Sign up&lt;/Link&gt;
              &lt;/div&gt;
  
          &lt;/div&gt;
  
          {children}
  
      &lt;/div&gt;
  );
  
  Base.propTypes = {
      children: PropTypes.object.isRequired
  };
  </code></pre>
  
  <p>HomePage:</p>
  
  <pre><code> import React from 'react';
  import { Card, CardTitle } from 'material-ui/Card';
  
  
  const HomePage = () =&gt; (
      &lt;Card className="container"&gt;
          &lt;CardTitle title="React Application" subtitle="This is the home page." /&gt;
      &lt;/Card&gt;
  );
  
  export default HomePage;
  </code></pre>
  
  <p>maybe one of the packages is deprecated but i am nut sure about that:
  package.json:</p>
  
  <pre><code> {
    "name": "grocery",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "start": "nodemon --use_strict index.js",
      "bundle": "webpack"
    },
    "author": "matant",
    "license": "ISC",
    "dependencies": {
      "body-parser": "^1.17.1",
      "create-react-class": "^15.5.2",
      "express": "^4.15.2",
      "material-ui": "^0.17.4",
      "prop-types": "^15.5.8",
      "react": "^15.5.4",
      "react-dom": "^15.5.4",
      "react-router": "^3.0.0",
      "react-tap-event-plugin": "^2.0.1",
      "validator": "^7.0.0"
    },
    "devDependencies": {
      "babel-core": "^6.24.1",
      "babel-loader": "^7.0.0",
      "babel-preset-es2015": "^6.24.1",
      "babel-preset-react": "^6.24.1",
      "nodemon": "^1.11.0",
      "webpack": "^2.4.1"
    }
  }
  </code></pre>