LogoLogoLogoLogo

OAuth (Auth)

Configure Google, GitHub, and other Better Auth social providers.

This guide shows how to enable social login in PaceKit. Google and GitHub are ready by default, with support for other Better Auth providers.

1. Add Environment Variables

Set the Client ID and Client Secret from each provider’s developer console.

.env
# Google
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=

# GitHub
GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=

2. Update Your Auth Config

Add providers inside the social object. If a variable is missing, that provider simply won’t load.

/src/features/auth/auth.ts
export const auth = betterAuth({
    socialProviders: {
        google: {
            clientId: process.env.GOOGLE_CLIENT_ID,
            clientSecret: process.env.GOOGLE_CLIENT_SECRET,
        },
        // ... Other providers
    },
    // ...
});

3. Social Sign-In Component

A drop-in component is available for rendering social buttons.

SignIn.tsx
import { GoogleSignInButton } from "@/src/components/auth/social";

<GoogleSignInButton />;

4. Callback Handling

Better Auth wires up callbacks automatically. Just ensure the URLs are added in each provider’s dashboard.

Development:

http://localhost:3000/api/auth/callback/google

Production:

https://your-domain.com/api/auth/callback/google

On this page