JavaScript by Example

Adding routes in the app component

What React Router does is pretty much simple; it simply renders a component based on the URL in the address bar. It uses history and location Web APIs for this purpose, but gives us simple, easy to use, component-based APIs, so that we can quickly set up our routing logic.

To add navigation between the components in the App.js file, add the following code in the App.js file's render method after the <Navbar></Navbar> component:

  render() {    return (      <div className="App">        <Navbar color="faded" light toggleable>          ....        </Navbar>        <Route exact path={routes.home} component={Home} />        <Route exact path={routes.post} component={Post} />        <Route exact path={routes.authors} component={AuthorList} /> <Route exact path={routes.author} ...