Router Docs
Router Examples
- Quickstart (file-based)
- Quickstart (code-based)
- Basic (file-based)
- Basic (code-based)
- Basic + React Query (file-based)
- Basic + React Query (code-based)
- Basic + SSR (file-based)
- Basic + SSR Streaming (file-based)
- Kitchen Sink (file-based)
- Kitchen Sink (code-based)
- Kitchen Sink + React Query (file-based)
- Kitchen Sink + React Query (code-based)
- Location Masking
- Authenticated Routes
- Scroll Restoration
- Deferred Data
- Navigation Blocking
- View Transitions
- Framer Motion
- With tRPC
- With tRPC + React Query
- Monorepo basic
- Monorepo basic (with lazy loading)
- Monorepo with React Query
React Example: Basic Ssr File Based GitHub
import { Await, createFileRoute } from '@tanstack/react-router'
import * as React from 'react'
export const Route = createFileRoute('/')({
loader: () => ({
date: new Date(),
}),
component: IndexComponent,
})
function IndexComponent() {
const data = Route.useLoaderData()
return (
<div className="p-2">
<h3>Welcome Home!</h3>
<p>Data: {data.date.getDate()}</p>
</div>
)
}