title: Declaring React Routes in a separate file and Importing
body: <p>I am new to React. I have been trying to declare routes in a file and then use it in another file.</p>
  <p>Here is my routes.js</p>
  <pre class="lang-js prettyprint-override"><code>import React from 'react';
  
  import { Route } from 'react-router-dom';
  import App from './components/App';
  import Template1 from './components/template1';
  import Template2 from './components/template2';
  import Template3 from './components/template3';
  
  const routes = (
    &lt;Route exact path=&quot;/&quot; component={App}&gt;
      &lt;Route exact path=&quot;/sessionstate1&quot; component={Template1} /&gt;
      &lt;Route exact path=&quot;/sessionstate2&quot; component={Template2} /&gt;
      &lt;Route exact path=&quot;/sessionstate3&quot; component={Template3} /&gt;
    &lt;/Route&gt;
  )
  
  export default routes
  </code></pre>
  <p>and index.js</p>
  <pre class="lang-js prettyprint-override"><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import { BrowserRouter as Router } from 'react-router-dom';
  import './styles/css/index.css';
  import routes from './routes.js';
  
  ReactDOM.render(
    &lt;Router history={browserHistory} routes={routes} /&gt;,
    document.getElementById('root')
  );
  </code></pre>
  <p>I am not getting any errors or warning but the page is not loading. Please tell me what I am missing</p>
  <p>Thanks</p>