Authentication

Authentication is handled by Better Auth, providing a secure and complete authentication system.

Features

  • Email & Password: Traditional sign-up and login.
  • OAuth Providers: Social login with Google, GitHub, etc.
  • Session Management: Secure session handling.
  • Protected Routes: Middleware to protect authenticated routes.

Configuration

The authentication configuration is located in your environment variables:

BETTER_AUTH_SECRET="your-secret-key"
BETTER_AUTH_URL="http://localhost:5173"

Adding OAuth Providers

To add a new provider (e.g., Google):

  1. Get your Client ID and Secret from the provider's developer console.
  2. Add them to your .env file:
GOOGLE_CLIENT_ID="your-client-id"
GOOGLE_CLIENT_SECRET="your-client-secret"
  1. Update your Better Auth configuration to include the provider.

Protecting Routes

To protect a route, you can check for the session in your route loader or component:

import { redirect } from '@tanstack/react-router'
// Import your auth client/session helper

export const Route = createFileRoute('/dashboard')({
  beforeLoad: async ({ context }) => {
    const session = await getSession();
    if (!session) {
      throw redirect({
        to: '/login',
      })
    }
  },
})

API Routes

Authentication endpoints are automatically handled by Better Auth.