React Routing
// Tips: Whenever you passing a Javascript variable as "props", if you're not passing in as a "string" and if you passing in as "boolean" or a variable you need to put in curly bracket! e.g component={NotFound}
// Then make a stateless functional component
// wrap everything inside "BrowserRouter" component
// "Match" component is meaning that when the browser exact match the home page "/"
// then which component should be showing? in this case {StorePicker}
// cool thing about "Match's" you can place this anywhere in your application!
// use Miss tag when page is not found
const Root = () => {
return(
<BrowserRouter>
<div>
<Match exactly pattern="/" component={ StorePicker } />
<Match pattern="/store/:storeId" component={ App } />
<Miss component={ NotFound } />
</div>
</BrowserRouter>
)
}
render(<Root/>, document.querySelector('#main'));