Una vez instaladas las dependencias necesarias, podemos proceder a integrar la biblioteca en nuestra aplicación.

Para incorporar la funcionalidad de enrutamiento en nuestra aplicación, es necesario envolver el componente raíz con BrowserRouter de la biblioteca react-router-dom. Este paso es fundamental porque inicializa el sistema de enrutamiento y permite gestionar la navegación en función de la URL.

Ejemplo

• Abrir el archivo index.js en el proyecto;
• Importar el componente BrowserRouter desde la biblioteca react-router-dom:

import { BrowserRouter } from "react-router-dom";

• Envolver el componente App con el componente BrowserRouter, como se muestra a continuación (líneas 9-11):

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App/App";
import { BrowserRouter } from "react-router-dom";

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </React.StrictMode>
);

Al envolver el componente App con BrowserRouter, se habilita la funcionalidad de enrutamiento en la aplicación.