? React Router — Installation & Setup

// Install React Router for web applications
npm install react-router-dom

// Yarn alternative installation command
yarn add react-router-dom

// Recommended folder structure for React Router apps
src/
│
├── components/
│   ├── Navbar.js
│   └── Home.js
│
├── pages/
│   ├── About.js
│   └── Contact.js
│
├── App.js
├── router.js
└── index.js

// index.js - Define routes using createBrowserRouter
import React from "react";
import ReactDOM from "react-dom/client";
import { createBrowserRouter, RouterProvider } from "react-router-dom";
import App from "./App";
import About from "./pages/About";
import Contact from "./pages/Contact";

const router = createBrowserRouter([
{ path: "/", element: <App /> },
{ path: "/about", element: <About /> },
{ path: "/contact", element: <Contact /> },
]);

ReactDOM.createRoot(document.getElementById("root")).render(
<RouterProvider router={router} />
);

// App.js - Navigation using Link component
import React from "react";
import { Link } from "react-router-dom";

function App() {
return (
<div className="text-center">
<h2>Welcome to My React Router App</h2>
<nav>
<Link to="/">Home</Link>
<Link to="/about">About</Link>
<Link to="/contact">Contact</Link>
</nav>
</div>
);
}

export default App;