Auth Module

Overview

KitRocket uses Better Auth v1 for authentication. It's a TypeScript-first auth library that runs entirely on your server — no third-party auth service required.

Out of the box you get:

• Email/password registration and login
• Google OAuth
• GitHub OAuth
• Magic link (passwordless email login)
• Session management with secure cookies
• Role-based access (admin, user)

All auth logic lives in src/lib/auth/ and auth UI components live in src/components/auth/.

Configuration

Environment variables

AUTH_SECRET="your-random-secret"
BETTER_AUTH_URL="http://localhost:3000"
GOOGLE_CLIENT_ID="your-google-client-id"
GOOGLE_CLIENT_SECRET="your-google-client-secret"
GITHUB_CLIENT_ID="your-github-client-id"
GITHUB_CLIENT_SECRET="your-github-client-secret"

Server configuration

The Better Auth server instance is configured in:

import { betterAuth } from "better-auth";
import { drizzleAdapter } from "better-auth/adapters/drizzle";
import { db } from "@/lib/db";

export const auth = betterAuth({
  database: drizzleAdapter(db),
  secret: process.env.AUTH_SECRET,
  baseURL: process.env.BETTER_AUTH_URL,
  emailAndPassword: {
    enabled: true,
  },
  socialProviders: {
    google: {
      clientId: process.env.GOOGLE_CLIENT_ID!,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
    },
    github: {
      clientId: process.env.GITHUB_CLIENT_ID!,
      clientSecret: process.env.GITHUB_CLIENT_SECRET!,
    },
  },
});

Client configuration

import { createAuthClient } from "better-auth/react";

export const authClient = createAuthClient({
  baseURL: process.env.NEXT_PUBLIC_APP_URL,
});

export const { useSession, signIn, signOut, signUp } = authClient;

Usage

Get the current session

In client components:

"use client";

import { useSession } from "@/lib/auth/client";

export function Header() {
  const { data: session, isPending } = useSession();

  if (isPending) return <div>Loading...</div>;
  if (!session) return <div>Not logged in</div>;

  return <div>Welcome, {session.user.name}</div>;
}

In server components:

import { auth } from "@/lib/auth/server";
import { headers } from "next/headers";

export default async function DashboardPage() {
  const session = await auth.api.getSession({
    headers: await headers(),
  });

  if (!session) redirect("/login");

  return <div>Welcome, {session.user.name}</div>;
}

Protect routes with middleware

import { auth } from "@/lib/auth/server";
import { NextRequest, NextResponse } from "next/server";

const protectedRoutes = ["/dashboard", "/settings", "/billing"];

export async function authMiddleware(request: NextRequest) {
  const session = await auth.api.getSession({
    headers: request.headers,
  });

  const isProtected = protectedRoutes.some((route) =>
    request.nextUrl.pathname.startsWith(route)
  );

  if (isProtected && !session) {
    return NextResponse.redirect(new URL("/login", request.url));
  }

  return NextResponse.next();
}

Sign in and sign up

"use client";

import { signIn } from "@/lib/auth/client";

export function LoginForm() {
  async function handleEmailLogin(formData: FormData) {
    await signIn.email({
      email: formData.get("email") as string,
      password: formData.get("password") as string,
    });
  }

  async function handleGoogleLogin() {
    await signIn.social({ provider: "google" });
  }

  // ... render form
}

Customization

Add a new OAuth provider

Better Auth supports dozens of providers. To add Twitter/X:

socialProviders: {
  // ... existing providers
  twitter: {
    clientId: process.env.TWITTER_CLIENT_ID!,
    clientSecret: process.env.TWITTER_CLIENT_SECRET!,
  },
},

See the full guide at Add OAuth Provider.

Change session duration

export const auth = betterAuth({
  // ...
  session: {
    expiresIn: 60 * 60 * 24 * 30, // 30 days in seconds
    updateAge: 60 * 60 * 24, // refresh every 24 hours
  },
});

Customize login page

Edit the login form component and layout:

• src/components/auth/login-form.tsx — form fields and logic
• src/app/(auth)/login/page.tsx — page layout
• src/app/(auth)/layout.tsx — shared auth layout (centered card)

Removing this module

If you're using a different auth solution:

1. Delete src/lib/auth/ directory
2. Delete src/components/auth/ directory
3. Delete src/app/(auth)/ directory
4. Delete src/app/api/auth/ directory
5. Remove auth middleware from src/middleware.ts
6. Drop auth tables: users, sessions, accounts
7. Remove Better Auth dependencies:

pnpm remove better-auth

8. Implement your own session check wherever useSession or auth.api.getSession was used