Route Configuration in React

// Library Mode: Object-based routes
const router = createBrowserRouter([
  {
    path: "/",
    element: <Root />,
    loader: rootLoader,
    action: rootAction,
    errorElement: <ErrorBoundary />,
    children: [
      {
        index: true, // Default child route
        element: <Index />,
      },
      {
        path: "teams",
        element: <Teams />,
        loader: teamsLoader,
        children: [
          {
            path: ":teamId",
            element: <Team />,
            loader: teamLoader,
          }
        ]
      },
      {
        path: "*",
        element: <NotFound />
      }
    ]
  }
])

// Framework Mode: File-based routing
// app/routes/_index.tsx → /
// app/routes/about.tsx → /about
// app/routes/blog.$id.tsx → /blog/:id
// app/routes/$.tsx → catch-all