React Router Link With Params

import React from 'react';
import ErrorBoundary from './errorBoundary/errorPage';
import Home from './homePage';
import NotFoundPage from './notFoundPage';
import About from './about/aboutPage';
import Authors from './authors/authorPage';
import ManageAuthorPage from './authors/manageAuthorPage';
import { Switch, Route, Redirect, Router, NotFoundRoute } from 'react-router-dom';

class MyRouter extends React.Component{
  render(){
    return(
      <div>
        <Switch>
          <Route exact path="/app" name="app" component={Home}/>
          <Route exact path="/" component={Home}/>
          <Route path="/author" name="author" component={Authors} />
          <Route path="/about" name="about" component={About}/>
          <Route name="manageAuthor" path="/manageAuthor/:id" component={ManageAuthorPage} />
          <Route name="addAuthor" path="/addAuthor" component={ManageAuthorPage} />
          <Redirect from="/about/*" to="/about" />
          <Route component={NotFoundPage} />
        </Switch>
      </div>
    )
  }
}


export default MyRouter;

"use strict";

import React from 'react';
import propTypes from 'prop-types';
import { Link } from 'react-router-dom';
import Router from 'react-router-dom';

class AuthorList extends React.Component{
  componentDidCatch(error, info) {
    console.log(error + " - " + info);
  }

  render(){
    var createAuthorRow = function(author){
      return (
        <tr key={ author.id }>
          <td><Link to={`/manageAuthor/${ author.id }`}>{ author.id }</Link></td>

          <td>{ author.firstName } { author.lastName }</td>
        </tr>
      );
    }

    return (
      <table className="table">
        <thead>
          <tr>
            <th>ID</th>
            <th>NAME</th>
          </tr>
        </thead>
        <tbody>
          { this.props.authors.map(createAuthorRow, this) }
        </tbody>
      </table>
    );
  }
}

AuthorList.propTypes = {
  authors : propTypes.array.isRequired
};

AuthorList.defaultProps = {
  authors: []
};

export default AuthorList;

<ul className="nav navbar-nav">
  <li className="nav-item">
    <Link className="nav-link" to="app"> Dashboard </Link>
  </li>
  <li className="nav-item">
    <Link className="nav-link" to="author"> Authors </Link>
  </li>
  <li className="nav-item">
    <Link className="nav-link" to="about"> About </Link>
  </li>
</ul>