Skip to main content
Back to course
Log in
Get started
Someone wanted to learn this too, so Grasp built them a personal learning path.
Create your own
TanStack, SSR, Auth, SSO
·
Module 1
Module 1: Getting Started with TanStack Start & Router
1
Setting Up TanStack Start with Environment Variables
Initialize a TanStack Start project and configure environment variables for server and client contexts.
Initialize a TanStack Start project and configure environment variables for server and client contexts.
2
Vinxi SSR and Hydration Configuration
Configure the Vinxi bundler for Server-Side Rendering (SSR) and client hydration.
Configure the Vinxi bundler for Server-Side Rendering (SSR) and client hydration.
3
TanStack Router vs. Next.js App Router: File-Based Routing Compared
Compare TanStack Router's file-based routing conventions with Next.js App Router patterns.
Compare TanStack Router's file-based routing conventions with Next.js App Router patterns.
4
Typed Routes with Path and Search Parameters
Create typed route definitions with path parameters and search params.
Create typed route definitions with path parameters and search params.
5
Typed Navigation with React Router
Implement typed navigation using the Link component and useNavigate hook.
Implement typed navigation using the Link component and useNavigate hook.
6
Nested and Layout Routes
Implement nested routes and layout routes for shared UI.
Implement nested routes and layout routes for shared UI.
7
Server vs. Client: TanStack Start's Execution Model
Analyze TanStack Start's mechanism for distinguishing server-only ('use server') and client-side code execution.
Analyze TanStack Start's mechanism for distinguishing server-only ('use server') and client-side code execution.
8
Typed Server-Side Data Fetching
Implement server-side data fetching in route loaders with typed data returns.
Implement server-side data fetching in route loaders with typed data returns.
9
Error Handling and Pending States in Route Transitions
Handle loader errors and implement pending states for route transitions.
Handle loader errors and implement pending states for route transitions.
10
Preload on Hover for Faster Perceived Performance
Implement data preloading on link hover to improve perceived performance.
Implement data preloading on link hover to improve perceived performance.
Previous module
Next module
Module 2: Migrating a Client-Side SPA to TanStack Start