react.router.js

//MainLayout
const linkStyle={activeStyle: {color:'red'}}

export const MainLayout = props => {
  <div>
    ...
  //default Default loser
  <Link to="/greeting/loser/default" {...LinkStyle}> Welcome,. Loser</Link>
  
  //magic taken care of by REACT ROUTER see nested Routes in Router index.js
  {props.children || 'please select a sub-page'}


  //GreetingPage,js
   export const GreetingPage = props = {
     
     Hello {props.params.firstname} {props.params.lastname}  
  );
  
  //404.js
  
   export const 404 = props = {
     
    //some HTML
  );

//index.js

import {Router, Route, hashHistory} from 'react-router'

import {MainLayout} from 'MainLayout'





ReactDOM.render(
  
  <Provider store={store}
    <Router history={hashHistory}
       <Route path-"/" component={mainLayout}
       <Route path-"/listing" component={ReduxApp}
       <Route path-"/greeting/:lastname/:firstname" component={GreetingPage}
       <Route path-"*" component={404}
  
  
  )}