To add a new route to your Vite/React application follow these steps:

  1. Install React router:
    $ npm install react-router-dom localforage match-sorter sort-by
  2. Open main.jsx, import react router and add the BrowserRouter:
    import { BrowserRouter } from 'react-router-dom'
    ReactDOM.createRoot(document.getElementById('root')).render(
      <React.StrictMode>
        <BrowserRouter>
        <App />
        </BrowserRouter>
      </React.StrictMode>,
    )
  3. Open App.jsx and make it like this:
    import { Link, Route, Routes } from 'react-router-dom'
    import Navigation from "./components/Navigation"
    import Home from "./components/Home"

    function App() {
      return (
        <div className="bg-slate-100">
          <Navigation />
          <Routes>
            <Route path="/home" element={<Home />} />
          </Routes>
          <h1>Welcome</h1>
        </div>
      )
    }

    export default App
  4. For more information visit https://reactrouter.com/en/main/start/tutorial