Authentication

StarterKitPro uses Auth.js v5 for user authentication.

Configuration

• Main Setup: Configure providers and core settings in auth.config.ts or auth.ts.
• Redirects: Set post-login/logout URLs in config/app-config.ts (e.g., auth.afterLogin).

Authentication Methods

StarterKitPro includes these by default, presented via components/forms/user-auth-form.tsx:

• Magic Link: Passwordless email login. See Magic Link Setup (link to be created/updated).
• Google OAuth: Sign in with Google. See Google Auth Setup (link to be created/updated).

Adding other providers like Twitter, GitHub, etc., is straightforward by updating the Auth.js configuration. See Adding Providers (link to be created/updated).

Accessing the Session

Client-Side (React Components)

Use the useSession hook:

import { useSession } from "next-auth/react";
 
function UserInfo() {
  const { data: session, status } = useSession();
 
  if (status === "loading") return <p>Loading...</p>;
  if (!session) return <p>Not authenticated</p>;
 
  return <p>Signed in as {session.user?.email}</p>;
}

Server-Side (Server Components, API Routes, Server Actions)

Use the auth() helper function:

import { auth } from "@/lib/auth"; // Adjust import path if needed
 
export default async function ServerSideCheck() {
  const session = await auth();
 
  if (!session?.user) {
    // Handle unauthenticated state
    return <p>Access Denied</p>;
  }
 
  // Access user data via session.user
  return <p>Welcome, user {session.user.id}!</p>;
}