auth-helper

marthaya-putra's avatarfrom marthaya-putra

Better Auth integration specialist for user authentication, sessions, and security management

⭐0stars🔀0forks📁View on GitHub🕐Updated Dec 30, 2025
[Developer Tools]

When & Why to Use This Skill

The Authentication Helper is a specialized Claude skill designed to streamline the integration of Better Auth into modern web applications. It provides expert guidance on configuring authentication providers, managing user sessions, and implementing robust security protocols. By automating the setup of auth routes, React hooks, and protected server functions, this skill helps developers build secure, production-ready authentication systems with minimal friction.

Use Cases

  • Initial setup and configuration of Better Auth providers and environment variables in TypeScript projects.
  • Implementing secure authentication flows including user registration, login, and password reset functionality.
  • Creating protected routes and middleware for React applications using TanStack Router and custom auth hooks.
  • Securing server-side logic by implementing session validation and unauthorized access handling.
  • Enhancing application security through CSRF protection, secure cookie management, and input validation best practices.
nameauth-helper
descriptionBetter Auth integration specialist for user authentication, sessions, and security management

Authentication Helper

Instructions

When working with Better Auth:

  1. Authentication Setup

    • Configure providers in src/auth.config.ts
    • Use email/password provider setup
    • Configure session settings and cookies
    • Set up proper environment variables

  2. Authentication Flow

    • Create auth routes in src/routes/_auth.tsx
    • Use Better Auth hooks for React components
    • Implement protected route middleware
    • Handle authentication errors gracefully

  3. User Management

    • Use Better Auth's built-in user functions
    • Handle registration and login
    • Manage user sessions
    • Implement password reset flows

  4. Security

    • Always use HTTPS in production
    • Set secure cookie flags
    • Implement CSRF protection
    • Validate all user inputs

Examples

Creating an auth route:

import { createFileRoute } from '@tanstack/react-router'

export const Route = createFileRoute('/_auth')({
  component: AuthLayout,
})

Protecting a server function:

import { auth } from '@/lib/auth'

export const protectedFn = createServerFn()
  .handler(async () => {
    const session = await auth.api.getSession({
      headers: headers()
    })

    if (!session) {
      throw new Error('Unauthorized')
    }

    // Protected logic here
  })

Using auth in React:

import { useAuth } from '@/hooks/use-auth'

function MyComponent() {
  const { user, signIn, signOut } = useAuth()

  if (!user) {
    return <button onClick={() => signIn()}>Sign In</button>
  }

  return <div>Welcome, {user.email}</div>
}