Example of Basic React Routing

import React from 'react';
import ReactDOM from "react-dom";
import { BrowserRouter,Redirect, Link, Route, Switch } from "react-router-dom";


function Nav(){

   return(
    <>  
            <ul>   
              <li><Link to="/dashboard">Dashboard</Link></li>
              <li><Link to="/product">Product</Link></li>
              <li><Link to="/contact">Contact</Link></li>             
         </ul>           
          

   </>

   );
}


function MainContent()
{
  return(
    
        <div>
           <Switch>
              <Route exact path="/" component={Login} />
              <Route exact path="/dashboard" component={Dashboard} />
              <Route exact path="/product" component={Product} />
              <Route exact path="/contact" component={Contact} />            
           </Switch>
        </div>
   
  );

}


function App() {
  return (
    <>
    <div className="App">  
    <BrowserRouter>
      <Nav /> 
      <MainContent />
    </BrowserRouter>     
    </div>
    </>
  );
}


function Dashboard(){
  return(
    <>
    <h1>Dashboard</h1>   
    </>
  );
}

//pages

function Product(){
  return(
    <>
    <h1>Product</h1>   
    </>
  );
}


function Contact(){
  return(
    <>
    <h1>Contact</h1>   
    </>
  );
}

function Login(){
  return(
    <>
    <h1>Login</h1>   
    </>
  );
}