Navigation in React

routes.tsx

import React from "react"; 
import { BrowserRouter, Routes, Route, NavLink } from "react-router-dom"; 
import Home from "./components/Home"; 
import About from "./components/About"; 
import Contact from "./components/Contact"; 

function App() { 

	return ( 
		<> 
			<BrowserRouter> 
						<NavLink exact activeClassName="active" to="/" > 
							Home 
						</NavLink> 
						<NavLink  exact activeClassName="active" to="/about" > 
							About 
						</NavLink> 
						<NavLink  exact activeClassName="active" to="/contact" > 
							Contact 
						</NavLink> 
				<Routes> 
					<Route exact path="/" element={<Home />} /> 
					<Route exact path="/about" element={<About />} /> 
					<Route exact path="/contact" element={<Contact />} /> 
				</Routes> 
			</BrowserRouter> 
		</> 
	); 
} 

export default App;