Basic Routing Setup with TanStack Router

Demonstrate how to configure your application entry file with TanStack Router, defining a simple route to a home page component.

import { createBrowserRouter, RouterProvider, Route } from 'tanstack-router-dom';
import React from 'react';
import ReactDOM from 'react-dom/client';
import HomePage from './HomePage'; // Your home page component

Import necessary functions from 'tanstack-router-dom', React, ReactDOM, and your HomePage component.

const router = createBrowserRouter([
  {
    path: '/',
    element: <HomePage />, // Define the route for the home page
  },
]);

Create a router instance using 'createBrowserRouter', defining a route to the HomePage component for the root path.

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <RouterProvider router={router} /> // Set up the RouterProvider with the defined routes
  </React.StrictMode>
);

Render the application with 'RouterProvider' at the application root, passing the 'router' configuration as a prop to handle routing.