How can you configure routing for a multi-page React application using React-Router

Question

With the help of code ca you explainthat How can you configure routing for a multi-page React application using React-Router?

Answer 1

To configure routing for a multi-page React application using React-Router , you:

1. Install react-router-dom via npm:

npm install react-router-dom

2. Set up routes in your app by wrapping it with <BrowserRouter> and defining paths with <Route> components inside a <Routes> container. For example:

import { BrowserRouter, Routes, Route } from 'react-router-dom';

function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/about" element={<About />} />
        <Route path="/contact" element={<Contact />} />
      </Routes>
    </BrowserRouter>
  );
}