Introducing the Auth0 SDK for TanStack Start

Summary

Auth0 released a dedicated SDK for TanStack Start, a full-stack React framework, to replace hand-rolled OIDC flows or adapted SDKs. The SDK provides hooks, components, route guards, server middleware, and server helpers that integrate with TanStack Start’s server functions, middleware, and file-based router. Setup involves installing the package, configuring environment variables for the Auth0 application, creating a server-side Auth0 instance, registering the auth0Middleware in the start file, and wiring the router context and Auth0Provider in the root route. The SDK automatically mounts auth routes for login, callback, logout, profile, and backchannel logout, and supports features like login, logout, protected routes via requireAuth, session reading on the server with getSession, and additional capabilities such as passkeys, organizations, MFA, and API scope checks. The fastest way to try it is the official quickstart, which scaffolds a fresh app and adds the SDK step by step.

Takeaways

1. 1

   The SDK provides hooks (useAuth0, useUser, useLogin, useLogout), components (SignedIn, SignedOut), route guards (requireAuth, requireOrg), server middleware (requireAuthMiddleware, withApiAuth), and server helpers (getSession, getAccessToken) that integrate directly with TanStack Start’s primitives.

2. 2

   Setup requires installing the package, configuring environment variables, creating a server-side Auth0 instance, registering auth0Middleware in the start file, and wiring the router context and Auth0Provider in the root route.

3. 3

   The SDK automatically mounts auth routes (/auth/login, /auth/callback, /auth/logout, /auth/profile, /auth/backchannel-logout) once middleware is registered, and supports additional features like passkeys, organizations, MFA, and API scope checks through the same middleware and guard pattern.

FAQ