İçeriğe geç
Sedat Demir
Geri dön

Better Auth: Lucia'nın Deprecated Olmasından Sonra Yeni Authentication Standardı

Better Auth: Lucia'nın Deprecated Olmasından Sonra Yeni Authentication Standardı

Authentication, her web uygulamasının temel taşıdır. Yıllardır React ve Next.js ekosisteminde kimlik doğrulama çözümleri konusunda süregelen bir arayış var. NextAuth (Auth.js), Clerk, Supabase Auth ve Lucia gibi seçenekler arasında geliştiriciler hep bir denge aradı: basitlik, esneklik ve kontrol.

2024'ün başlarında Lucia Auth'un yaratıcısı, projenin deprecated (kullanımdan kaldırılmış) olduğunu duyurduğunda, binlerce geliştirici alternatif aramaya başladı. İşte tam bu noktada Better Auth sahneye çıktı.

Lucia Auth Neden Deprecated Oldu?

Lucia Auth, session-based authentication için minimalist ve elegant bir çözümdü. Veritabanı-agnostic yapısı, framework bağımsızlığı ve sade API'si ile kısa sürede büyük bir topluluk edindi. Ancak yaratıcısı Pilcrow, projenin sürdürülmesinin zorlaştığını ve authentication'ın bir kütüphane değil, bir eğitim meselesi olduğunu belirterek projeyi deprecated ilan etti.

Lucia Auth'un README dosyasında şu mesaj yer almaya başladı:

"Lucia is now deprecated. Use its resources to implement auth from scratch or use a different library."

Bu karar, topluluğu ikiye böldü. Bir kısım geliştirici kendi authentication katmanını yazmaya yönelirken, büyük çoğunluk production-ready bir alternatif aradı. İşte Better Auth, tam olarak bu ihtiyaca yanıt olarak doğdu.

Better Auth Nedir?

Better Auth, TypeScript-first, framework-agnostic ve kapsamlı bir authentication ve authorization kütüphanesidir. Lucia'nın bıraktığı boşluğu doldurmak için tasarlanmış olup, şu temel felsefeler üzerine inşa edilmiştir:

Kurulum ve Temel Yapılandırma

Better Auth'u bir Next.js projesine entegre etmek oldukça basittir. İlk adım olarak paketi kuralım:

npm install better-auth

Sunucu Tarafı Yapılandırması

Projenizin kök dizininde auth.ts dosyası oluşturarak Better Auth'u yapılandırın:

// lib/auth.ts
import { betterAuth } from "better-auth";
import { prismaAdapter } from "better-auth/adapters/prisma";
import { PrismaClient } from "@prisma/client";

const prisma = new PrismaClient();

export const auth = betterAuth({
  database: prismaAdapter(prisma, {
    provider: "postgresql",
  }),
  emailAndPassword: {
    enabled: true,
    requireEmailVerification: true,
  },
  socialProviders: {
    github: {
      clientId: process.env.GITHUB_CLIENT_ID!,
      clientSecret: process.env.GITHUB_CLIENT_SECRET!,
    },
    google: {
      clientId: process.env.GOOGLE_CLIENT_ID!,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
    },
  },
  session: {
    expiresIn: 60 * 60 * 24 * 7, // 7 gün
    updateAge: 60 * 60 * 24, // Her gün session güncelle
  },
});

API Route Oluşturma

Next.js App Router kullanıyorsanız, Better Auth'un tüm authentication endpoint'lerini yönetecek bir catch-all route oluşturmanız gerekir:

// app/api/auth/[...all]/route.ts
import { auth } from "@/lib/auth";
import { toNextJsHandler } from "better-auth/next-js";

export const { POST, GET } = toNextJsHandler(auth);

Bu tek dosya ile Better Auth, /api/auth/* altındaki tüm authentication işlemlerini otomatik olarak yönetir: giriş, kayıt, çıkış, session kontrolü, OAuth callback'leri ve daha fazlası.

İstemci Tarafı Yapılandırması

İstemci tarafında Better Auth client'ını oluşturun:

// lib/auth-client.ts
import { createAuthClient } from "better-auth/react";

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

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

Pratik Kullanım Örnekleri

Kayıt Formu

// components/sign-up-form.tsx
"use client";

import { signUp } from "@/lib/auth-client";
import { useState } from "react";
import { useRouter } from "next/navigation";

export function SignUpForm() {
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [name, setName] = useState("");
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState("");
  const router = useRouter();

  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
    setLoading(true);
    setError("");

    const { data, error: authError } = await signUp.email({
      email,
      password,
      name,
    });

    if (authError) {
      setError(authError.message ?? "Bir hata oluştu");
      setLoading(false);
      return;
    }

    router.push("/dashboard");
  };

  return (
    <form onSubmit={handleSubmit} className="space-y-4">
      <div>
        <label htmlFor="name">Ad Soyad</label>
        <input
          id="name"
          type="text"
          value={name}
          onChange={(e) => setName(e.target.value)}
          required
        />
      </div>
      <div>
        <label htmlFor="email">E-posta</label>
        <input
          id="email"
          type="email"
          value={email}
          onChange={(e) => setEmail(e.target.value)}
          required
        />
      </div>
      <div>
        <label htmlFor="password">Şifre</label>
        <input
          id="password"
          type="password"
          value={password}
          onChange={(e) => setPassword(e.target.value)}
          minLength={8}
          required
        />
      </div>
      {error && <p className="text-red-500">{error}</p>}
      <button type="submit" disabled={loading}>
        {loading ? "Kayıt yapılıyor..." : "Kayıt Ol"}
      </button>
    </form>
  );
}

Sosyal Giriş Butonları

// components/social-login.tsx
"use client";

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

export function SocialLogin() {
  const handleGithubLogin = async () => {
    await signIn.social({
      provider: "github",
      callbackURL: "/dashboard",
    });
  };

  const handleGoogleLogin = async () => {
    await signIn.social({
      provider: "google",
      callbackURL: "/dashboard",
    });
  };

  return (
    <div className="flex flex-col gap-3">
      <button onClick={handleGithubLogin}>
        GitHub ile Giriş Yap
      </button>
      <button onClick={handleGoogleLogin}>
        Google ile Giriş Yap
      </button>
    </div>
  );
}

Session Kontrolü ve Korumalı Sayfalar

// components/user-profile.tsx
"use client";

import { useSession, signOut } from "@/lib/auth-client";
import { useRouter } from "next/navigation";

export function UserProfile() {
  const { data: session, isPending } = useSession();
  const router = useRouter();

  if (isPending) {
    return <div>Yükleniyor...</div>;
  }

  if (!session) {
    router.push("/login");
    return null;
  }

  return (
    <div>
      <h2>Hoş geldin, {session.user.name}!</h2>
      <p>{session.user.email}</p>
      <button
        onClick={async () => {
          await signOut();
          router.push("/");
        }}
      >
        Çıkış Yap
      </button>
    </div>
  );
}

Sunucu Tarafında Session Kontrolü (Server Component)

// app/dashboard/page.tsx
import { auth } from "@/lib/auth";
import { headers } from "next/headers";
import { redirect } from "next/navigation";

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

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

  return (
    <div>
      <h1>Dashboard</h1>
      <p>Hoş geldin, {session.user.name}!</p>
    </div>
  );
}

Plugin Sistemi: Better Auth'un Gerçek Gücü

Better Auth'un en güçlü yanlarından biri, modüler plugin mimarisidir. Temel authentication dışındaki her özellik plugin olarak eklenir. Bu sayede paket boyutu küçük kalır ve sadece ihtiyacınız olan özellikleri dahil edersiniz.

İki Faktörlü Kimlik Doğrulama (2FA)

// lib/auth.ts
import { betterAuth } from "better-auth";
import { twoFactor } from "better-auth/plugins";

export const auth = betterAuth({
  // ... diğer yapılandırmalar
  plugins: [
    twoFactor({
      issuer: "UygulamaAdınız",
      otpOptions: {
        period: 30, // TOTP kodu 30 saniye geçerli
        digits: 6,
      },
    }),
  ],
});

Client tarafında da plugin'i etkinleştirmeniz gerekir:

// lib/auth-client.ts
import { createAuthClient } from "better-auth/react";
import { twoFactorClient } from "better-auth/client/plugins";

export const authClient = createAuthClient({
  baseURL: process.env.NEXT_PUBLIC_APP_URL!,
  plugins: [
    twoFactorClient(),
  ],
});

Organization ve Rol Yönetimi

// lib/auth.ts
import { betterAuth } from "better-auth";
import { organization } from "better-auth/plugins";

export const auth = betterAuth({
  // ... diğer yapılandırmalar
  plugins: [
    organization({
      allowUserToCreateOrganization: true,
      roles: {
        owner: {
          permissions: ["manage:all"],
        },
        admin: {
          permissions: ["manage:members", "manage:settings"],
        },
        member: {
          permissions: ["read:data", "write:data"],
        },
      },
    }),
  ],
});

Diğer Popüler Plugin'ler

Better Auth, kutusundan çıkan birçok plugin sunar:

Better Auth vs Diğer Çözümler

Özellik Better Auth Auth.js Clerk Lucia (Deprecated)
Self-hosted
TypeScript-first Kısmi
Plugin sistemi
2FA desteği ✅ (Plugin) Manuel
Organization ✅ (Plugin)
Passkey ✅ (Plugin) Deneysel
E-posta/Şifre
Social OAuth Manuel
Ücretsiz Freemium

Auth.js (NextAuth) ile Karşılaştırma

Auth.js hâlâ popüler bir seçenek olsa da, v5'e geçiş süreci birçok breaking change getirdi ve toplulukta güven kaybına neden oldu. Better Auth, Auth.js'in zayıf kaldığı noktalarda öne çıkıyor:

Clerk ile Karşılaştırma

Clerk mükemmel bir hosted çözüm ama self-hosted değil, ücretli ve verileriniz üzerinde tam kontrol sahibi değilsiniz. Better Auth tüm bu sorunları ortadan kaldırır. Ancak Clerk'ün sunduğu hazır UI bileşenleri ve dashboard gibi özellikler Better Auth'da yoktur — bunları kendiniz oluşturmanız gerekir.

Veritabanı Şemasını Oluşturma

Better Auth, veritabanı şemanızı otomatik oluşturabilecek bir CLI aracıyla birlikte gelir:

npx @better-auth/cli generate

Bu komut, kullandığınız ORM'e göre migration dosyalarını oluşturur. Prisma kullanıyorsanız schema.prisma dosyanıza gerekli modelleri ekler; Drizzle kullanıyorsanız migration SQL'lerini üretir.

Better Auth'un temel olarak ihtiyaç duyduğu tablolar şunlardır:

Middleware ile Route Koruma

Next.js middleware kullanarak belirli rotaları koruyabilirsiniz:

// middleware.ts
import { NextRequest, NextResponse } from "next/server";
import { getSessionCookie } from "better-auth/cookies";

export async function middleware(request: NextRequest) {
  const sessionCookie = getSessionCookie(request);

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

  return NextResponse.next();
}

export const config = {
  matcher: ["/dashboard/:path*", "/settings/:path*"],
};

Production İçin Dikkat Edilmesi Gerekenler

Better Auth'u production ortamına taşırken şu noktalara dikkat edin:

  1. HTTPS zorunlu: Session cookie'leri güvenli olmalıdır
  2. Rate limiting: Brute-force saldırılarına karşı rate limit plugin'ini kullanın
  3. E-posta doğrulama: requireEmailVerification: true ayarını mutlaka aktifleştirin
  4. Güçlü şifre politikası: minPasswordLength ve benzeri ayarları yapılandırın
  5. CSRF koruması: Better Auth varsayılan olarak CSRF koruması sağlar
  6. Ortam değişkenleri: BETTER_AUTH_SECRET mutlaka güçlü ve gizli olmalıdır
# .env
BETTER_AUTH_SECRET="en-az-32-karakter-uzunlugunda-rastgele-bir-string"
BETTER_AUTH_URL="https://uygulamaniz.com"

Sonuç

Lucia Auth'un deprecated olması, React ve modern web geliştirme ekosisteminde kısa süreli bir boşluk yarattı. Ancak Better Auth, bu boşluğu fazlasıyla dolduracak kapasitede bir çözüm olarak kendini kanıtladı.

TypeScript-first yaklaşımı, plugin tabanlı modüler mimarisi, geniş framework desteği ve self-hosted yapısıyla Better Auth, 2024-2025 döneminde authentication çözümleri arasında en güçlü adaylardan biri. Özellikle Lucia'dan migration yapacak geliştiriciler için öğrenme eğrisi oldukça düşük; konseptler benzer ancak Better Auth çok daha fazla özelliği kutudan çıktığı haliyle sunuyor.

Eğer yeni bir proje başlıyorsanız veya mevcut authentication çözümünüzden memnun değilseniz, Better Auth'u kesinlikle değerlendirmenizi öneririm. Açık kaynak, aktif olarak geliştiriliyor ve topluluğu hızla büyüyor. Verilerinizin kontrolü sizde kalsın, SaaS bağımlılığından kurtulun ve modern authentication deneyiminin keyfini çıkarın.


Share this post on:

Sonraki Yazı
Hono.js Derinlemesine: Her Yerde Çalışan Ultrafast Web Framework