first commit

2026-04-26 22:14:08 +03:00
commit b2825e1698
41 changed files with 14258 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,41 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 # dependencies
 /node_modules
 /.pnp
 .pnp.*
 .yarn/*
 !.yarn/patches
 !.yarn/plugins
 !.yarn/releases
 !.yarn/versions
 # testing
 /coverage
 # next.js
 /.next/
 /out/
 # production
 /build
 # misc
 .DS_Store
 *.pem
 # debug
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 .pnpm-debug.log*
 # env files (can opt-in for committing if needed)
 .env*
 # vercel
 .vercel
 # typescript
 *.tsbuildinfo
 next-env.d.ts
--- a/README.md
+++ b/README.md
@@ -0,0 +1,36 @@
 This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
 ## Getting Started
 First, run the development server:
 ```bash
 npm run dev
 # or
 yarn dev
 # or
 pnpm dev
 # or
 bun dev
 ```
 Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
 This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
 ## Learn More
 To learn more about Next.js, take a look at the following resources:
 - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
 - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
 You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
 ## Deploy on Vercel
 The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
 Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
--- a/app/api/auth/[...nextauth]/route.ts
+++ b/app/api/auth/[...nextauth]/route.ts
@@ -0,0 +1,6 @@
 import NextAuth from "next-auth";
 import { authOptions } from "@/lib/auth-options";
 const handler = NextAuth(authOptions);
 export { handler as GET, handler as POST };
--- a/app/api/auth/cookie-login/route.ts
+++ b/app/api/auth/cookie-login/route.ts
@@ -0,0 +1,96 @@
 import { NextRequest, NextResponse } from "next/server";
 import { cookies } from "next/headers";
 import {
  COOKIE_ACCESS,
  COOKIE_REFRESH,
  COOKIE_OPTS,
  ACCESS_MAX_AGE,
  REFRESH_MAX_AGE,
 } from "@/lib/auth-cookies";
 const BASE_URL =
  process.env.BASE_API_URL ??
  process.env.NEXT_PUBLIC_BASE_API_URL ??
  "http://127.0.0.1:8080";
 export async function POST(request: NextRequest) {
  try {
    const body = await request.json();
    const { email, password } = body as { email?: string; password?: string };
    if (!email || !password) {
      return NextResponse.json(
        { error: "E-posta ve şifre gerekli." },
        { status: 400 }
      );
    }
    let res: Response;
    try {
      res = await fetch(`${BASE_URL}/api/v1/auth/login`, {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          accept: "application/json",
        },
        body: JSON.stringify({ email: String(email).trim(), password }),
      });
    } catch (fetchErr) {
      const msg =
        process.env.NODE_ENV === "development" && fetchErr instanceof Error
          ? `Backend erişilemedi: ${fetchErr.message} (URL: ${BASE_URL})`
          : "Giriş servisi şu an kullanılamıyor.";
      return NextResponse.json({ error: msg }, { status: 502 });
    }
    let data: unknown;
    try {
      const text = await res.text();
      data = text ? JSON.parse(text) : {};
    } catch {
      data = {};
    }
    if (!res.ok) {
      const message =
        (data as { detail?: string })?.detail ?? "Giriş başarısız";
      return NextResponse.json(
        { error: message },
        { status: res.status >= 400 ? res.status : 500 }
      );
    }
    const access_token = (data as { access_token?: string })?.access_token;
    const refresh_token = (data as { refresh_token?: string })?.refresh_token;
    const user = (data as { user?: unknown })?.user;
    if (!access_token || !refresh_token) {
      return NextResponse.json(
        {
          error:
            process.env.NODE_ENV === "development"
              ? "Backend token döndürmedi."
              : "Giriş yanıtı geçersiz.",
        },
        { status: 502 }
      );
    }
    const cookieStore = await cookies();
    cookieStore.set(COOKIE_ACCESS, access_token, {
      ...COOKIE_OPTS,
      maxAge: ACCESS_MAX_AGE,
    });
    cookieStore.set(COOKIE_REFRESH, refresh_token, {
      ...COOKIE_OPTS,
      maxAge: REFRESH_MAX_AGE,
    });
    return NextResponse.json({ user });
  } catch (e) {
    const message =
      process.env.NODE_ENV === "development" && e instanceof Error
        ? e.message
        : "Sunucu hatası.";
    return NextResponse.json({ error: message }, { status: 500 });
  }
 }
--- a/app/api/auth/cookie-logout/route.ts
+++ b/app/api/auth/cookie-logout/route.ts
@@ -0,0 +1,10 @@
 import { NextResponse } from "next/server";
 import { cookies } from "next/headers";
 import { COOKIE_ACCESS, COOKIE_REFRESH, COOKIE_OPTS } from "@/lib/auth-cookies";
 export async function POST() {
  const cookieStore = await cookies();
  cookieStore.set(COOKIE_ACCESS, "", { ...COOKIE_OPTS, maxAge: 0 });
  cookieStore.set(COOKIE_REFRESH, "", { ...COOKIE_OPTS, maxAge: 0 });
  return NextResponse.json({ ok: true });
 }
--- a/app/api/auth/cookie-session/route.ts
+++ b/app/api/auth/cookie-session/route.ts
@@ -0,0 +1,34 @@
 import { NextResponse } from "next/server";
 import { cookies } from "next/headers";
 import { COOKIE_ACCESS } from "@/lib/auth-cookies";
 const BASE_URL =
  process.env.BASE_API_URL ?? process.env.NEXT_PUBLIC_BASE_API_URL ?? "http://127.0.0.1:8080";
 export async function GET() {
  const cookieStore = await cookies();
  const accessToken = cookieStore.get(COOKIE_ACCESS)?.value;
  if (!accessToken) {
    return NextResponse.json({ loggedIn: false });
  }
  try {
    const res = await fetch(`${BASE_URL}/api/v1/auth/me`, {
      headers: {
        accept: "application/json",
        Authorization: `Bearer ${accessToken}`,
      },
    });
    if (!res.ok) {
      return NextResponse.json({ loggedIn: false });
    }
    const data = await res.json();
    return NextResponse.json({
      loggedIn: true,
      user: (data as { user?: unknown }).user,
    });
  } catch {
    return NextResponse.json({ loggedIn: false });
  }
 }
--- a/app/auth/login/page.tsx
+++ b/app/auth/login/page.tsx
@@ -0,0 +1,153 @@
 "use client";
 import React, { useRef, useState } from "react";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
 import { Turnstile, type TurnstileRef } from "nextjs-turnstile";
 import { Loader2 } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { loginViaCookie } from "@/lib/auth-api";
 import { AuthSocialButtons } from "@/components/auth-social-buttons";
 import { cn } from "@/lib/utils";
 const TURNSTILE_SITE_KEY =
  process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY ?? process.env.NEXT_PUBLIC_CLOUD_FLARE_SITE_KEY ?? "";
 export default function LoginPage() {
  const router = useRouter();
  const turnstileRef = useRef<TurnstileRef>(null);
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [turnstileToken, setTurnstileToken] = useState<string | null>(null);
  const [error, setError] = useState<string | null>(null);
  const [loading, setLoading] = useState(false);
  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
    setError(null);
    if (!email.trim()) {
      setError("E-posta gerekli.");
      return;
    }
    if (!password) {
      setError("Şifre gerekli.");
      return;
    }
    if (TURNSTILE_SITE_KEY && !turnstileToken) {
      setError("Lütfen doğrulamayı tamamlayın.");
      return;
    }
    setLoading(true);
    try {
      await loginViaCookie(email.trim(), password);
      if (typeof window !== "undefined") window.dispatchEvent(new Event("auth-change"));
      router.push("/");
      router.refresh();
    } catch (err) {
      setError(err instanceof Error ? err.message : "Giriş yapılamadı.");
      turnstileRef.current?.reset();
      setTurnstileToken(null);
    } finally {
      setLoading(false);
    }
  };
  return (
    <div className="flex min-h-[calc(100vh-4rem)] items-center justify-center bg-zinc-50 px-4 py-12 dark:bg-neutral-950">
      <div className="w-full max-w-md animate-in fade-in duration-300">
        <div className="rounded-2xl border border-neutral-200 bg-white p-8 shadow-sm dark:border-neutral-800 dark:bg-neutral-900">
          <h1 className="text-2xl font-bold text-neutral-900 dark:text-white">
            Giriş yap
          </h1>
          <p className="mt-1 text-sm text-neutral-500 dark:text-neutral-400">
            Hesabınıza giriş yapın
          </p>
          <form onSubmit={handleSubmit} className="mt-6 space-y-4">
            {error && (
              <div
                className="rounded-lg bg-red-50 px-3 py-2 text-sm text-red-700 dark:bg-red-950/50 dark:text-red-400"
                role="alert"
              >
                {error}
              </div>
            )}
            <div className="space-y-2">
              <Label htmlFor="login-email">E-posta</Label>
              <Input
                id="login-email"
                type="email"
                autoComplete="email"
                placeholder="ornek@email.com"
                value={email}
                onChange={(e) => setEmail(e.target.value)}
                disabled={loading}
                className={cn(
                  "w-full rounded-lg border-neutral-200 dark:border-neutral-700"
                )}
              />
            </div>
            <div className="space-y-2">
              <Label htmlFor="login-password">Şifre</Label>
              <Input
                id="login-password"
                type="password"
                autoComplete="current-password"
                placeholder="••••••••"
                value={password}
                onChange={(e) => setPassword(e.target.value)}
                disabled={loading}
                className="w-full rounded-lg border-neutral-200 dark:border-neutral-700"
              />
            </div>
            {TURNSTILE_SITE_KEY && (
              <div className="flex justify-center [&_iframe]:max-w-full">
                <Turnstile
                  ref={turnstileRef}
                  siteKey={TURNSTILE_SITE_KEY}
                  theme="auto"
                  onSuccess={setTurnstileToken}
                  onExpire={() => setTurnstileToken(null)}
                  onError={() => setTurnstileToken(null)}
                />
              </div>
            )}
            <Button
              type="submit"
              className="w-full rounded-lg"
              size="lg"
              disabled={loading}
            >
              {loading ? (
                <>
                  <Loader2 className="size-4 animate-spin" />
                  Giriş yapılıyor...
                </>
              ) : (
                "Giriş yap"
              )}
            </Button>
            <AuthSocialButtons callbackUrl="/" disabled={loading} />
          </form>
          <p className="mt-6 text-center text-sm text-neutral-600 dark:text-neutral-400">
            Hesabınız yok mu?{" "}
            <Link
              href="/auth/register"
              className="font-medium text-blue-600 hover:underline dark:text-blue-400"
            >
              Kayıt olun
            </Link>
          </p>
        </div>
      </div>
    </div>
  );
 }
--- a/app/auth/register/page.tsx
+++ b/app/auth/register/page.tsx
@@ -0,0 +1,227 @@
 "use client";
 import React, { useRef, useState } from "react";
 import Link from "next/link";
 import { Turnstile, type TurnstileRef } from "nextjs-turnstile";
 import { Loader2 } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { register } from "@/lib/auth-api";
 import { AuthSocialButtons } from "@/components/auth-social-buttons";
 import { cn } from "@/lib/utils";
 const TURNSTILE_SITE_KEY =
  process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY ?? process.env.NEXT_PUBLIC_CLOUD_FLARE_SITE_KEY ?? "";
 export default function RegisterPage() {
  const turnstileRef = useRef<TurnstileRef>(null);
  const [email, setEmail] = useState("");
  const [firstName, setFirstName] = useState("");
  const [lastName, setLastName] = useState("");
  const [username, setUsername] = useState("");
  const [password, setPassword] = useState("");
  const [turnstileToken, setTurnstileToken] = useState<string | null>(null);
  const [error, setError] = useState<string | null>(null);
  const [loading, setLoading] = useState(false);
  const [success, setSuccess] = useState<string | null>(null);
  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
    setError(null);
    setSuccess(null);
    if (!email.trim()) {
      setError("E-posta gerekli.");
      return;
    }
    if (!firstName.trim()) {
      setError("Ad gerekli.");
      return;
    }
    if (!lastName.trim()) {
      setError("Soyad gerekli.");
      return;
    }
    if (!username.trim()) {
      setError("Kullanıcı adı gerekli.");
      return;
    }
    if (password.length < 6) {
      setError("Şifre en az 6 karakter olmalıdır.");
      return;
    }
    if (TURNSTILE_SITE_KEY && !turnstileToken) {
      setError("Lütfen doğrulamayı tamamlayın.");
      return;
    }
    setLoading(true);
    try {
      const res = await register({
        email: email.trim(),
        first_name: firstName.trim(),
        last_name: lastName.trim(),
        username: username.trim(),
        password,
      });
      setSuccess(
        res.message ?? "Kayıt başarılı. Giriş yapmadan önce e-posta doğrulaması yapın."
      );
      turnstileRef.current?.reset();
      setTurnstileToken(null);
    } catch (err) {
      setError(err instanceof Error ? err.message : "Kayıt oluşturulamadı.");
      turnstileRef.current?.reset();
      setTurnstileToken(null);
    } finally {
      setLoading(false);
    }
  };
  return (
    <div className="flex min-h-[calc(100vh-4rem)] items-center justify-center bg-zinc-50 px-4 py-12 dark:bg-neutral-950">
      <div className="w-full max-w-md animate-in fade-in duration-300">
        <div className="rounded-2xl border border-neutral-200 bg-white p-8 shadow-sm dark:border-neutral-800 dark:bg-neutral-900">
          <h1 className="text-2xl font-bold text-neutral-900 dark:text-white">
            Kayıt ol
          </h1>
          <p className="mt-1 text-sm text-neutral-500 dark:text-neutral-400">
            Yeni hesap oluşturun
          </p>
          <form onSubmit={handleSubmit} className="mt-6 space-y-4">
            {error && (
              <div
                className="rounded-lg bg-red-50 px-3 py-2 text-sm text-red-700 dark:bg-red-950/50 dark:text-red-400"
                role="alert"
              >
                {error}
              </div>
            )}
            {success && (
              <div
                className="rounded-lg bg-green-50 px-3 py-2 text-sm text-green-800 dark:bg-green-950/50 dark:text-green-300"
                role="status"
              >
                {success}
              </div>
            )}
            <div className="grid grid-cols-2 gap-4">
              <div className="space-y-2">
                <Label htmlFor="reg-first">Ad</Label>
                <Input
                  id="reg-first"
                  type="text"
                  autoComplete="given-name"
                  placeholder="Ad"
                  value={firstName}
                  onChange={(e) => setFirstName(e.target.value)}
                  disabled={loading}
                  className="rounded-lg border-neutral-200 dark:border-neutral-700"
                />
              </div>
              <div className="space-y-2">
                <Label htmlFor="reg-last">Soyad</Label>
                <Input
                  id="reg-last"
                  type="text"
                  autoComplete="family-name"
                  placeholder="Soyad"
                  value={lastName}
                  onChange={(e) => setLastName(e.target.value)}
                  disabled={loading}
                  className="rounded-lg border-neutral-200 dark:border-neutral-700"
                />
              </div>
            </div>
            <div className="space-y-2">
              <Label htmlFor="reg-username">Kullanıcı adı</Label>
              <Input
                id="reg-username"
                type="text"
                autoComplete="username"
                placeholder="kullanici_adi"
                value={username}
                onChange={(e) => setUsername(e.target.value)}
                disabled={loading}
                className={cn(
                  "w-full rounded-lg border-neutral-200 dark:border-neutral-700"
                )}
              />
            </div>
            <div className="space-y-2">
              <Label htmlFor="reg-email">E-posta</Label>
              <Input
                id="reg-email"
                type="email"
                autoComplete="email"
                placeholder="ornek@email.com"
                value={email}
                onChange={(e) => setEmail(e.target.value)}
                disabled={loading}
                className="w-full rounded-lg border-neutral-200 dark:border-neutral-700"
              />
            </div>
            <div className="space-y-2">
              <Label htmlFor="reg-password">Şifre</Label>
              <Input
                id="reg-password"
                type="password"
                autoComplete="new-password"
                placeholder="En az 6 karakter"
                value={password}
                onChange={(e) => setPassword(e.target.value)}
                disabled={loading}
                className="w-full rounded-lg border-neutral-200 dark:border-neutral-700"
              />
            </div>
            {TURNSTILE_SITE_KEY && (
              <div className="flex justify-center [&_iframe]:max-w-full">
                <Turnstile
                  ref={turnstileRef}
                  siteKey={TURNSTILE_SITE_KEY}
                  theme="auto"
                  onSuccess={setTurnstileToken}
                  onExpire={() => setTurnstileToken(null)}
                  onError={() => setTurnstileToken(null)}
                />
              </div>
            )}
            <Button
              type="submit"
              className="w-full rounded-lg"
              size="lg"
              disabled={loading}
            >
              {loading ? (
                <>
                  <Loader2 className="size-4 animate-spin" />
                  Kaydediliyor...
                </>
              ) : (
                "Kayıt ol"
              )}
            </Button>
            <AuthSocialButtons callbackUrl="/" disabled={loading} />
          </form>
          <p className="mt-6 text-center text-sm text-neutral-600 dark:text-neutral-400">
            Zaten hesabınız var mı?{" "}
            <Link
              href="/auth/login"
              className="font-medium text-blue-600 hover:underline dark:text-blue-400"
            >
              Giriş yapın
            </Link>
          </p>
        </div>
      </div>
    </div>
  );
 }
--- a/app/favicon.ico
+++ b/app/favicon.ico
--- a/app/globals.css
+++ b/app/globals.css
@@ -0,0 +1,126 @@
@import "tailwindcss";
@import "tw-animate-css";
@import "shadcn/tailwind.css";
@custom-variant dark (&:is(.dark *));
@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
  --color-sidebar-ring: var(--sidebar-ring);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar: var(--sidebar);
  --color-chart-5: var(--chart-5);
  --color-chart-4: var(--chart-4);
  --color-chart-3: var(--chart-3);
  --color-chart-2: var(--chart-2);
  --color-chart-1: var(--chart-1);
  --color-ring: var(--ring);
  --color-input: var(--input);
  --color-border: var(--border);
  --color-destructive: var(--destructive);
  --color-accent-foreground: var(--accent-foreground);
  --color-accent: var(--accent);
  --color-muted-foreground: var(--muted-foreground);
  --color-muted: var(--muted);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-secondary: var(--secondary);
  --color-primary-foreground: var(--primary-foreground);
  --color-primary: var(--primary);
  --color-popover-foreground: var(--popover-foreground);
  --color-popover: var(--popover);
  --color-card-foreground: var(--card-foreground);
  --color-card: var(--card);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --radius-2xl: calc(var(--radius) + 8px);
  --radius-3xl: calc(var(--radius) + 12px);
  --radius-4xl: calc(var(--radius) + 16px);
 }
 :root {
  --radius: 0.625rem;
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
 }
 .dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.205 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.205 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.922 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.704 0.191 22.216);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(0.556 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(1 0 0 / 10%);
  --sidebar-ring: oklch(0.556 0 0);
 }
@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
 }
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -0,0 +1,49 @@
 import type { Metadata } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
 import Header from "@/components/header";
 import { ThemeProvider } from "@/components/theme-provider";
 import { SessionProvider } from "@/components/providers/session-provider";
 const geistSans = Geist({
  variable: "--font-geist-sans",
  subsets: ["latin"],
 });
 const geistMono = Geist_Mono({
  variable: "--font-geist-mono",
  subsets: ["latin"],
 });
 export const metadata: Metadata = {
  title: "Create Next App",
  description: "Generated by create next app",
 };
 export default function RootLayout({
  children,
 }: Readonly<{
  children: React.ReactNode;
 }>) {
  return (
    <html lang="en" suppressHydrationWarning>
      <head>
        <script
          dangerouslySetInnerHTML={{
            __html: `(function(){var s=localStorage.getItem('techwix-theme');var d=s==='dark'||(!s&&typeof window!=='undefined'&&window.matchMedia('(prefers-color-scheme: dark)').matches);document.documentElement.classList.toggle('dark',d);})();`,
          }}
        />
      </head>
      <body
        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
      >
        <ThemeProvider>
          <SessionProvider>
            <Header />
            <main className="min-h-screen">{children}</main>
          </SessionProvider>
        </ThemeProvider>
      </body>
    </html>
  );
 }
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -0,0 +1,11 @@
 import BlogHero from "@/components/blog-hero";
 import BlogContent from "@/components/blog-content";
 export default function Home() {
  return (
    <div className="bg-zinc-50 font-sans dark:bg-black">
      <BlogHero />
      <BlogContent />
    </div>
  );
 }
--- a/app/profile/page.tsx
+++ b/app/profile/page.tsx
@@ -0,0 +1,107 @@
 "use client";
 import React, { useEffect, useState } from "react";
 import { useSession } from "next-auth/react";
 import Link from "next/link";
 import { getCookieSession, type AuthUser } from "@/lib/auth-api";
 export default function ProfilePage() {
  const { data: session, status } = useSession();
  const [cookieUser, setCookieUser] = useState<AuthUser | null | undefined>(undefined);
  useEffect(() => {
    getCookieSession().then((s) =>
      setCookieUser(s.loggedIn && s.user ? s.user : null)
    );
  }, []);
  const loading = status === "loading" || cookieUser === undefined;
  if (loading) {
    return (
      <div className="container mx-auto flex min-h-[60vh] items-center justify-center px-4">
        <p className="text-neutral-500">Yükleniyor...</p>
      </div>
    );
  }
  if (session?.user) {
    const u = session.user;
    return (
      <div className="container mx-auto max-w-lg px-4 py-12">
        <h1 className="text-2xl font-bold text-neutral-900 dark:text-white">
          Profil
        </h1>
        <div className="mt-6 rounded-xl border border-neutral-200 bg-white p-6 dark:border-neutral-800 dark:bg-neutral-900">
          <p className="text-sm text-neutral-500 dark:text-neutral-400">
            {u.email ?? u.name ?? "Oturum açıldı"}
          </p>
          {u.name && (
            <p className="mt-1 font-medium text-neutral-900 dark:text-white">
              {u.name}
            </p>
          )}
        </div>
        <p className="mt-4 text-sm text-neutral-500 dark:text-neutral-400">
          <Link href="/" className="text-blue-600 hover:underline dark:text-blue-400">
            Ana sayfaya dön
          </Link>
        </p>
      </div>
    );
  }
  if (cookieUser) {
    const u = cookieUser;
    return (
      <div className="container mx-auto max-w-lg px-4 py-12">
        <h1 className="text-2xl font-bold text-neutral-900 dark:text-white">
          Profil
        </h1>
        <div className="mt-6 rounded-xl border border-neutral-200 bg-white p-6 dark:border-neutral-800 dark:bg-neutral-900">
          <p className="text-sm text-neutral-500 dark:text-neutral-400">
            {u.email}
          </p>
          <p className="mt-1 font-medium text-neutral-900 dark:text-white">
            {u.first_name} {u.last_name}
          </p>
          {u.username && (
            <p className="mt-1 text-sm text-neutral-600 dark:text-neutral-400">
              @{u.username}
            </p>
          )}
        </div>
        <p className="mt-4 text-sm text-neutral-500 dark:text-neutral-400">
          <Link href="/" className="text-blue-600 hover:underline dark:text-blue-400">
            Ana sayfaya dön
          </Link>
        </p>
      </div>
    );
  }
  return (
    <div className="container mx-auto max-w-lg px-4 py-12">
      <h1 className="text-2xl font-bold text-neutral-900 dark:text-white">
        Profil
      </h1>
      <p className="mt-4 text-neutral-600 dark:text-neutral-400">
        Bu sayfayı görmek için giriş yapmalısınız.
      </p>
      <div className="mt-4 flex gap-3">
        <Link
          href="/auth/login"
          className="text-sm font-medium text-blue-600 hover:underline dark:text-blue-400"
        >
          Giriş yap
        </Link>
        <Link
          href="/auth/register"
          className="text-sm font-medium text-blue-600 hover:underline dark:text-blue-400"
        >
          Kayıt ol
        </Link>
      </div>
    </div>
  );
 }
--- a/belgeler/login_register.md
+++ b/belgeler/login_register.md
@@ -0,0 +1,291 @@
 ## POST Request
 Login 
 ```bash
 curl -X 'POST' \
  'http://127.0.0.1:8080/api/v1/auth/login' \
  -H 'accept: application/json' \
  -H 'Content-Type: application/json' \
  -d '{
    "email": "beyhan@beyhan.dev",
    "password": "1923btO**"
  }'
 ```
 ### Request URL
 ```
 http://127.0.0.1:8080/api/v1/auth/login
 ```
 ---
 ### Server Response
 | Code | Details |
 |------|---------|
 | 200  | Success |
 #### Response Body
 ```json
 {
  "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjo2LCJlbWFpbCI6ImJleWhhbkBiZXloYW4uZGV2IiwiaXNfYWRtaW4iOnRydWUsImZpcnN0X25hbWUiOiJCZXloYW4iLCJsYXN0X25hbWUiOiJPxJ91ciIsInRva2VuX3R5cGUiOiJhY2Nlc3MiLCJzdWIiOiI2IiwiZXhwIjoxNzcxNzAxNjcyLCJpYXQiOjE3NzE2OTQ0NzJ9.i3OcKU8ChmzR9DirsyRS1gvR0lvAcHuPCNnIvbnvtIc",
  "refresh_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjo2LCJlbWFpbCI6ImJleWhhbkBiZXloYW4uZGV2IiwiaXNfYWRtaW4iOnRydWUsImZpcnN0X25hbWUiOiJCZXloYW4iLCJsYXN0X25hbWUiOiJPxJ91ciIsInRva2VuX3R5cGUiOiJyZWZyZXNoIiwic3ViIjoiNiIsImV4cCI6MTc3NDI4NjQ3MiwiaWF0IjoxNzcxNjk0NDcyfQ.MHG1gK1Jt_6mi2kLXfXpg59QhXaLX-KxFBdMPzQ3X1U",
  "user": {
    "email": "beyhan@beyhan.dev",
    "first_name": "Beyhan",
    "id": 6,
    "is_admin": true,
    "last_name": "Oğur",
    "username": "Beyhan Oğur"
  }
 }
 ```
 #########################
 ## GET Request
 Me
 ```bash
 curl -X 'GET' \
  'http://127.0.0.1:8080/api/v1/auth/me' \
  -H 'accept: application/json' \
  -H 'Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjo2LCJlbWFpbCI6ImJleWhhbkBiZXloYW4uZGV2IiwiaXNfYWRtaW4iOnRydWUsImZpcnN0X25hbWUiOiJCZXloYW4iLCJsYXN0X25hbWUiOiJPxJ91ciIsInRva2VuX3R5cGUiOiJhY2Nlc3MiLCJzdWIiOiI2IiwiZXhwIjoxNzcxNzAyMTU2LCJpYXQiOjE3NzE2OTQ5NTZ9.QHid2xqKsdwe1E-vkrZLA7nB_qL3DEcEWztbkFoOaZU'
 ```
 ### Request URL
 ```
 http://127.0.0.1:8080/api/v1/auth/me
 ```
 ---
 ### Server Response
 | Code | Details |
 |------|---------|
 | 200  | Success |
 #### Response Body
 ```json
 {
  "user": {
    "email": "beyhan@beyhan.dev",
    "first_name": "Beyhan",
    "id": 6,
    "is_admin": true,
    "last_name": "Oğur"
  }
 }
 ```
 #####################################
 ## POST Request
 Refrsfh Token
 ```bash
 curl -X 'POST' \
  'http://127.0.0.1:8080/api/v1/auth/refresh' \
  -H 'accept: application/json' \
  -H 'Content-Type: application/json' \
  -d '{
    "refresh_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjo2LCJlbWFpbCI6ImJleWhhbkBiZXloYW4uZGV2IiwiaXNfYWRtaW4iOnRydWUsImZpcnN0X25hbWUiOiJCZXloYW4iLCJsYXN0X25hbWUiOiJPxJ91ciIsInRva2VuX3R5cGUiOiJyZWZyZXNoIiwic3ViIjoiNiIsImV4cCI6MTc3NDI4Njk1NiwiaWF0IjoxNzcxNjk0OTU2fQ.IiVn9tmnItk_mmB5Hfp0dRJL_jFHlvp68hDvJROeGqo"
  }'
 ```
 ### Request URL
 ```
 http://127.0.0.1:8080/api/v1/auth/refresh
 ```
 ---
 ### Server Response
 | Code | Details |
 |------|---------|
 | 200  | Success |
 #### Response Body
 ```json
 {
  "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjo2LCJlbWFpbCI6ImJleWhhbkBiZXloYW4uZGV2IiwiaXNfYWRtaW4iOnRydWUsImZpcnN0X25hbWUiOiJCZXloYW4iLCJsYXN0X25hbWUiOiJPxJ91ciIsInRva2VuX3R5cGUiOiJhY2Nlc3MiLCJzdWIiOiI2IiwiZXhwIjoxNzcxNzAyMzQwLCJpYXQiOjE3NzE2OTUxNDB9.0RqIfDNY3Tc--Waaztgh2dOeKAxpUKWEPfN86SK7kOw",
  "refresh_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjo2LCJlbWFpbCI6ImJleWhhbkBiZXloYW4uZGV2IiwiaXNfYWRtaW4iOnRydWUsImZpcnN0X25hbWUiOiJCZXloYW4iLCJsYXN0X25hbWUiOiJPxJ91ciIsInRva2VuX3R5cGUiOiJyZWZyZXNoIiwic3ViIjoiNiIsImV4cCI6MTc3NDI4NzE0MCwiaWF0IjoxNzcxNjk1MTQwfQ.bZkKmx-4KvlSy4A1Hf9YU5hZAV4e9HQfjtnbyG1PYwY"
 }
 ```
 ## POST Request
 Register 
 ```bash
 curl -X 'POST' \
  'http://127.0.0.1:8080/api/v1/auth/register' \
  -H 'accept: application/json' \
  -H 'Content-Type: application/json' \
  -d '{
    "email": "aresss1234@ddddd.com",
    "first_name": "adi",
    "last_name": "soyadi",
    "password": "password",
    "username": "username"
  }'
 ```
 ### Request URL
 ```
 http://127.0.0.1:8080/api/v1/auth/register
 ```
 ---
 ### Server Response
 | Code | Details |
 |------|---------|
 | 201  | Created |
 #### Response Body
 ```json
 {
  "message": "registration successful, please verify your email before login",
  "user": {
    "email": "aresss1234@ddddd.com",
    "email_verified": false,
    "first_name": "adi",
    "id": 44,
    "is_admin": false,
    "last_name": "soyadi",
    "username": "username"
  }
 }
 ```
 ####################
 email Doğrulama
 ## GET Request
 ```bash
 curl -X 'GET' \
  'http://127.0.0.1:8080/api/v1/auth/verify-email?token=7f9e5f4d2036e1194856cc1184f0ffbeb86480ecc08d2c5ca18e6da1de0bf829' \
  -H 'accept: application/json'
 ```
 ### Request URL
 ```
 http://127.0.0.1:8080/api/v1/auth/verify-email?token=7f9e5f4d2036e1194856cc1184f0ffbeb86480ecc08d2c5ca18e6da1de0bf829
 ```
 ---
 ### Server Response
 | Code | Details |
 |------|---------|
 | 200  | Success |
 #### Response Body
 ```json
 {
  "message": "email verified successfully"
 }
 ```
 Resent Email dogrulamasi
 url -X 'POST' \
  'http://127.0.0.1:8080/api/v1/auth/resend-verification' \
  -H 'accept: application/json' \
  -H 'Content-Type: application/json' \
  -d '{
  "email": "aressfsdfss1234@ddddd.com"
 }'
 Request URL
 http://127.0.0.1:8080/api/v1/auth/resend-verification
 ################################
 ## Prompt: Next.js Login/Register Pages with Turnstile Protection
 **Task:**  
 Using the dependencies and devDependencies listed below, design and implement Login and Register pages for a Next.js application. Both pages should be protected with Turnstile (Cloudflare's CAPTCHA alternative).
 ---
 ### Dependencies
 ```json
 {
  "class-variance-authority": "^0.7.1",
  "clsx": "^2.1.1",
  "lucide-react": "^0.575.0",
  "next": "16.1.6",
  "next-themes": "^0.4.6",
  "radix-ui": "^1.4.3",
  "react": "19.2.3",
  "react-dom": "19.2.3",
  "tailwind-merge": "^3.5.0"
 }
 ```
 ### DevDependencies
 ```json
 {
  "@tailwindcss/postcss": "^4",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
  "eslint": "^9",
  "eslint-config-next": "16.1.6",
  "shadcn": "^3.8.5",
  "tailwindcss": "^4",
  "tw-animate-css": "^1.4.0",
  "typescript": "^5"
 }
 ```
 ---
 ### Requirements
 1. **Design modern, responsive Login and Register pages using Next.js, React, Radix UI, and TailwindCSS utilities.**
 2. **Use Cloudflare Turnstile to protect both forms (login & register) from bot abuse.**
 3. **Leverage shadcn UI and lucide-react for enhanced UI and icons.**
 4. **Apply type safety using TypeScript and provide user feedback for validation/errors.**
 5. **Use best practices for modularity, accessibility (a11y), and theming (next-themes).**
 6. **Add animations with tw-animate-css for user interactions (e.g., button hover/submission feedback).**
 7. **Style using tailwind-merge, class-variance-authority, and clsx for dynamic class management.**
 8. **Lint and format with the provided ESLint setup.**
 ---
 **Extra:**  
 - Ensure proper email/password validation and error handling.
 - Make the UI adaptive for light/dark themes.
 - Provide a clear description in TypeScript doc comments.
 ---
 **References:**  
 - [Cloudflare Turnstile Docs](https://developers.cloudflare.com/turnstile/)
 - [shadcn UI](https://ui.shadcn.com/)
 - [Radix UI](https://www.radix-ui.com/)
 ---
--- a/components.json
+++ b/components.json
@@ -0,0 +1,23 @@
 {
  "$schema": "https://ui.shadcn.com/schema.json",
  "style": "new-york",
  "rsc": true,
  "tsx": true,
  "tailwind": {
    "config": "",
    "css": "app/globals.css",
    "baseColor": "neutral",
    "cssVariables": true,
    "prefix": ""
  },
  "iconLibrary": "lucide",
  "rtl": false,
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils",
    "ui": "@/components/ui",
    "lib": "@/lib",
    "hooks": "@/hooks"
  },
  "registries": {}
 }
--- a/components/auth-social-buttons.tsx
+++ b/components/auth-social-buttons.tsx
@@ -0,0 +1,80 @@
 "use client";
 import { signIn } from "next-auth/react";
 /** Google ve GitHub ile giriş butonları. callbackUrl OAuth sonrası yönlenecek sayfa. */
 export function AuthSocialButtons({
  callbackUrl = "/",
  disabled = false,
 }: {
  callbackUrl?: string;
  disabled?: boolean;
 }) {
  return (
    <>
      <div className="relative my-4">
        <div className="absolute inset-0 flex items-center">
          <span className="w-full border-t border-neutral-200 dark:border-neutral-700" />
        </div>
        <p className="relative flex justify-center text-xs uppercase tracking-wide text-neutral-500 dark:text-neutral-400">
          <span className="bg-white px-2 dark:bg-neutral-900">veya</span>
        </p>
      </div>
      <div className="flex flex-col gap-2 sm:flex-row sm:gap-3">
        <button
          type="button"
          disabled={disabled}
          onClick={() => signIn("google", { callbackUrl })}
          className="inline-flex w-full items-center justify-center gap-2 rounded-lg border border-neutral-200 bg-white px-4 py-2.5 text-sm font-medium text-neutral-700 shadow-xs transition hover:bg-neutral-50 disabled:opacity-50 dark:border-neutral-700 dark:bg-neutral-800 dark:text-neutral-200 dark:hover:bg-neutral-700"
        >
          <GoogleIcon className="size-5" />
          Google ile giriş
        </button>
        <button
          type="button"
          disabled={disabled}
          onClick={() => signIn("github", { callbackUrl })}
          className="inline-flex w-full items-center justify-center gap-2 rounded-lg border border-neutral-200 bg-white px-4 py-2.5 text-sm font-medium text-neutral-700 shadow-xs transition hover:bg-neutral-50 disabled:opacity-50 dark:border-neutral-700 dark:bg-neutral-800 dark:text-neutral-200 dark:hover:bg-neutral-700"
        >
          <GitHubIcon className="size-5" />
          GitHub ile giriş
        </button>
      </div>
    </>
  );
 }
 function GoogleIcon({ className }: { className?: string }) {
  return (
    <svg className={className} viewBox="0 0 24 24" aria-hidden>
      <path
        fill="#4285F4"
        d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
      />
      <path
        fill="#34A853"
        d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
      />
      <path
        fill="#FBBC05"
        d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
      />
      <path
        fill="#EA4335"
        d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
      />
    </svg>
  );
 }
 function GitHubIcon({ className }: { className?: string }) {
  return (
    <svg className={className} fill="currentColor" viewBox="0 0 24 24" aria-hidden>
      <path
        fillRule="evenodd"
        d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
        clipRule="evenodd"
      />
    </svg>
  );
 }
--- a/components/banner.tsx
+++ b/components/banner.tsx
@@ -0,0 +1,62 @@
 import React from "react";
 import { Search } from "lucide-react";
 export default function Banner() {
  return (
    <section className="relative">
      {/* Full-bleed hero image */}
      <div className="w-screen relative left-1/2 right-1/2 -translate-x-1/2">
        <img
          src="https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=1920&h=750&q=80&auto=format&fit=crop"
          alt="Hero"
          className="h-[750px] w-full object-cover"
        />
      </div>
      {/* Content container below the hero (no login/register) */}
      <div className="container mx-auto px-4 py-8">
        <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
          <div className="lg:col-span-2">
            <div className="rounded-2xl bg-white p-6 shadow-sm dark:bg-neutral-900">
              <h2 className="text-3xl font-bold mb-2">Welcome to Next Fiber</h2>
              <p className="text-sm text-muted-foreground">Discover articles, projects and updates from the team. Explore our latest posts and tutorials.</p>
            </div>
          </div>
          <aside className="space-y-6">
            <div className="rounded-lg border bg-white p-4 shadow-sm dark:bg-neutral-900">
              <div className="relative flex items-center gap-2 rounded-md bg-gray-100 px-3 py-2">
                <Search className="size-4 text-gray-600" />
                <input placeholder="Write your keyword..." className="w-full bg-transparent outline-none text-sm" />
              </div>
            </div>
            <div className="rounded-lg border bg-white p-4 shadow-sm dark:bg-neutral-900">
              <h3 className="mb-3 font-semibold">Popular Posts</h3>
              <ul className="space-y-3">
                <li className="flex items-start gap-3">
                  <img src="https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=80&q=60&auto=format&fit=crop" className="h-12 w-12 rounded-full object-cover" />
                  <div>
                    <div className="text-sm font-medium">How Wireless Technology is Changing Business</div>
                  </div>
                </li>
                <li className="flex items-start gap-3">
                  <img src="https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?w=80&q=60&auto=format&fit=crop" className="h-12 w-12 rounded-full object-cover" />
                  <div>
                    <div className="text-sm font-medium">Designing Faster Interfaces</div>
                  </div>
                </li>
                <li className="flex items-start gap-3">
                  <img src="https://images.unsplash.com/photo-1503342452485-86f7f3f45e2b?w=80&q=60&auto=format&fit=crop" className="h-12 w-12 rounded-full object-cover" />
                  <div>
                    <div className="text-sm font-medium">Productivity Tips for Developers</div>
                  </div>
                </li>
              </ul>
            </div>
          </aside>
        </div>
      </div>
    </section>
  );
 }
--- a/components/blog-content.tsx
+++ b/components/blog-content.tsx
@@ -0,0 +1,133 @@
 import React from "react";
 import Link from "next/link";
 import {
  Search,
  FileText,
  User,
  MessageCircle,
  Calendar,
  ArrowRight,
 } from "lucide-react";
 const popularPosts = [
  {
    title: "How Wireless Technology is Changing Business",
    date: "May 15, 2020",
    image:
      "https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=80&h=80&q=60&auto=format&fit=crop",
  },
  {
    title: "How Wireless Technology is Changing Business",
    date: "May 15, 2020",
    image:
      "https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?w=80&h=80&q=60&auto=format&fit=crop",
  },
  {
    title: "How Wireless Technology is Changing Business",
    date: "May 15, 2020",
    image:
      "https://images.unsplash.com/photo-1503342452485-86f7f3f45e2b?w=80&h=80&q=60&auto=format&fit=crop",
  },
 ];
 export default function BlogContent() {
  return (
    <section className="container mx-auto px-4 py-10 lg:py-12">
      <div className="grid grid-cols-1 gap-8 lg:grid-cols-3">
        {/* Main: Featured article */}
        <article className="lg:col-span-2">
          <div className="overflow-hidden rounded-xl bg-white shadow-sm dark:bg-neutral-900 dark:shadow-none">
            <div className="relative aspect-[2/1] w-full overflow-hidden bg-neutral-100 dark:bg-neutral-800">
              <img
                src="https://images.unsplash.com/photo-1557804506-669a67965ba0?w=800&h=400&q=80&auto=format&fit=crop"
                alt="How to become a successful businessman"
                className="h-full w-full object-cover"
                width={800}
                height={400}
              />
              <div className="absolute left-4 top-4 rounded-md bg-violet-600/90 px-3 py-1.5 text-sm font-medium text-white">
                08 Aug
              </div>
            </div>
            <div className="p-6">
              <div className="mb-3 flex flex-wrap items-center gap-x-5 gap-y-1 text-sm text-neutral-500 dark:text-neutral-400">
                <span className="flex items-center gap-1.5">
                  <FileText className="size-4" />
                  Technology / Business
                </span>
                <span className="flex items-center gap-1.5">
                  <User className="size-4" />
                  Andrew Paker
                </span>
                <span className="flex items-center gap-1.5">
                  <MessageCircle className="size-4" />
                  0 Comments
                </span>
              </div>
              <h2 className="mb-3 text-2xl font-bold text-neutral-900 dark:text-white lg:text-3xl">
                How to become a successful businessman
              </h2>
              <p className="mb-4 text-neutral-600 dark:text-neutral-300">
                Accelerate innovation with world-class tech teams We'll match
                you to an entire remote team of incredible freelance talent for
                all your software development needs.
              </p>
              <Link
                href="#"
                className="inline-flex items-center gap-1.5 text-sm font-semibold text-neutral-900 hover:text-violet-600 dark:text-white dark:hover:text-violet-400"
              >
                READ FULL
                <ArrowRight className="size-4" />
              </Link>
            </div>
          </div>
        </article>
        {/* Sidebar */}
        <aside className="space-y-6">
          <div className="rounded-xl bg-white p-4 shadow-sm dark:bg-neutral-900 dark:shadow-none">
            <div className="flex items-center gap-2 rounded-lg border border-neutral-200 bg-neutral-50 px-3 py-2.5 dark:border-neutral-700 dark:bg-neutral-800">
              <Search className="size-4 shrink-0 text-neutral-500" />
              <input
                type="search"
                placeholder="Write your keyword..."
                className="w-full bg-transparent text-sm outline-none placeholder:text-neutral-500 dark:placeholder:text-neutral-400"
              />
            </div>
          </div>
          <div className="rounded-xl bg-white p-5 shadow-sm dark:bg-neutral-900 dark:shadow-none">
            <h3 className="mb-4 font-bold text-neutral-900 dark:text-white">
              Popular Posts
            </h3>
            <ul className="space-y-4">
              {popularPosts.map((post, i) => (
                <li key={i}>
                  <Link
                    href="#"
                    className="flex gap-3 transition-opacity hover:opacity-80"
                  >
                    <img
                      src={post.image}
                      alt=""
                      className="h-14 w-14 shrink-0 rounded-full object-cover"
                    />
                    <div className="min-w-0 flex-1">
                      <p className="text-sm font-medium leading-snug text-neutral-900 dark:text-white">
                        {post.title}
                      </p>
                      <p className="mt-1 flex items-center gap-1.5 text-xs text-neutral-500 dark:text-neutral-400">
                        <Calendar className="size-3.5" />
                        {post.date}
                      </p>
                    </div>
                  </Link>
                </li>
              ))}
            </ul>
          </div>
        </aside>
      </div>
    </section>
  );
 }
--- a/components/blog-hero.tsx
+++ b/components/blog-hero.tsx
@@ -0,0 +1,49 @@
 import React from "react";
 import Link from "next/link";
 export default function BlogHero() {
  return (
    <section className="relative h-[750px] w-full overflow-hidden bg-neutral-200 dark:bg-neutral-800">
      {/* Gradient blobs */}
      <div
        className="absolute -left-[20%] -top-[30%] h-[80%] w-[60%] rounded-full opacity-90 blur-2xl"
        style={{
          background:
            "linear-gradient(135deg, rgba(59, 130, 246, 0.5) 0%, rgba(99, 102, 241, 0.4) 50%, rgba(139, 92, 246, 0.3) 100%)",
        }}
      />
      <div
        className="absolute -bottom-[25%] -right-[15%] h-[70%] w-[55%] rounded-full opacity-90 blur-2xl"
        style={{
          background:
            "linear-gradient(315deg, rgba(139, 92, 246, 0.5) 0%, rgba(99, 102, 241, 0.4) 50%, rgba(59, 130, 246, 0.25) 100%)",
        }}
      />
      {/* Subtle curve lines (optional decoration) */}
      <svg
        className="absolute right-[15%] top-1/2 h-48 w-48 -translate-y-1/2 opacity-[0.07]"
        viewBox="0 0 100 100"
        fill="none"
        stroke="white"
        strokeWidth="0.5"
      >
        <path d="M10 50 Q50 20 90 50 Q50 80 10 50" />
        <path d="M20 50 Q50 30 80 50" />
      </svg>
      {/* Content */}
      <div className="container relative z-10 mx-auto flex h-full min-h-0 flex-col items-center justify-center px-4 text-center">
        <h1 className="text-4xl font-bold tracking-tight text-white drop-shadow-md md:text-5xl lg:text-6xl">
          Blog Grid
        </h1>
        <nav className="mt-3 flex items-center gap-1.5 text-sm text-white/95">
          <Link href="/" className="hover:underline">
            Home
          </Link>
          <span className="opacity-70">/</span>
          <span className="text-white">Blog Grid</span>
        </nav>
      </div>
    </section>
  );
 }
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -0,0 +1,181 @@
 "use client";
 import React, { useEffect, useState } from "react";
 import Link from "next/link";
 import { useSession, signOut } from "next-auth/react";
 import clsx from "clsx";
 import { Search, ShoppingCart, ChevronDown, LogOut, User } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { ThemeToggle } from "@/components/theme-toggle";
 import {
  getCookieSession,
  logoutViaCookie,
  clearTokens,
  AUTH_CHANGE_EVENT,
  notifyAuthChange,
 } from "@/lib/auth-api";
 const navItems = [
  { label: "Home", href: "/", hasDropdown: true },
  { label: "About Us", href: "/about", hasDropdown: false },
  { label: "Pages", href: "/pages", hasDropdown: true },
  { label: "Blog", href: "/blog", hasDropdown: true, active: true },
  { label: "Contact", href: "/contact", hasDropdown: false },
 ];
 function TechwixLogo() {
  return (
    <Link href="/" className="flex items-center gap-2">
      <svg
        width="32"
        height="32"
        viewBox="0 0 32 32"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        className="shrink-0"
      >
        <defs>
          <linearGradient id="logoGrad" x1="0%" y1="0%" x2="100%" y2="100%">
            <stop offset="0%" stopColor="#3b82f6" />
            <stop offset="100%" stopColor="#8b5cf6" />
          </linearGradient>
        </defs>
        {/* Single gradient shape - diamond/arrowhead */}
        <path
          d="M16 5L27 16L16 27L5 16L16 5Z"
          fill="url(#logoGrad)"
        />
        <path
          d="M16 9L23 16L16 23L9 16L16 9Z"
          fill="white"
          fillOpacity="0.2"
        />
      </svg>
      <span className="text-xl font-semibold text-neutral-800 dark:text-neutral-100">
        Techwix
      </span>
    </Link>
  );
 }
 export default function Header() {
  const [scrolled, setScrolled] = useState(false);
  const { data: session, status } = useSession();
  const [cookieLoggedIn, setCookieLoggedIn] = useState(false);
  const isLoggedIn = Boolean(session?.user) || cookieLoggedIn;
  useEffect(() => {
    const onScroll = () => setScrolled(window.scrollY > 8);
    window.addEventListener("scroll", onScroll, { passive: true });
    onScroll();
    return () => window.removeEventListener("scroll", onScroll);
  }, []);
  const refreshCookieSession = () => {
    getCookieSession().then((s) => setCookieLoggedIn(s.loggedIn));
  };
  useEffect(() => {
    refreshCookieSession();
    const handler = () => refreshCookieSession();
    window.addEventListener(AUTH_CHANGE_EVENT, handler);
    return () => window.removeEventListener(AUTH_CHANGE_EVENT, handler);
  }, []);
  const handleLogout = async () => {
    clearTokens(); // eski localStorage token varsa temizle
    await logoutViaCookie();
    signOut({ callbackUrl: "/" });
    setCookieLoggedIn(false);
    notifyAuthChange();
  };
  return (
    <header
      className={clsx(
        "sticky top-0 z-40 w-full border-b border-neutral-200/80 transition-colors duration-200 backdrop-blur dark:border-neutral-800",
        scrolled
          ? "bg-white/95 shadow-sm dark:bg-neutral-950/95"
          : "bg-white dark:bg-neutral-950/90"
      )}
    >
      <div className="container mx-auto flex h-16 items-center justify-between gap-6 px-4 lg:px-6">
        <TechwixLogo />
        <nav className="hidden items-center gap-1 md:flex">
          {navItems.map((item) => (
            <Link
              key={item.href}
              href={item.href}
              className={clsx(
                "flex items-center gap-0.5 rounded-md px-3 py-2 text-sm font-medium transition-colors",
                item.active
                  ? "text-blue-500 dark:text-blue-400"
                  : "text-neutral-700 hover:text-neutral-900 dark:text-neutral-300 dark:hover:text-white"
              )}
            >
              {item.label}
              {item.hasDropdown && (
                <ChevronDown className="size-3.5 text-current opacity-70" />
              )}
            </Link>
          ))}
        </nav>
        <div className="flex items-center gap-2">
          <ThemeToggle />
          <button
            type="button"
            className="relative rounded-md p-2 text-neutral-600 hover:bg-neutral-100 hover:text-neutral-900 dark:text-neutral-400 dark:hover:bg-neutral-800 dark:hover:text-white"
            aria-label="Cart"
          >
            <ShoppingCart className="size-5" />
            <span className="absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-blue-500 text-[10px] font-medium text-white">
              0
            </span>
          </button>
          <button
            type="button"
            className="rounded-md p-2 text-neutral-600 hover:bg-neutral-100 hover:text-neutral-900 dark:text-neutral-400 dark:hover:bg-neutral-800 dark:hover:text-white"
            aria-label="Search"
          >
            <Search className="size-5" />
          </button>
          {status === "loading" ? null : isLoggedIn ? (
            <>
              <Link
                href="/profile"
                className="flex items-center gap-1.5 rounded-md px-3 py-2 text-sm font-medium text-neutral-700 hover:bg-neutral-100 hover:text-neutral-900 dark:text-neutral-300 dark:hover:bg-neutral-800 dark:hover:text-white"
              >
                <User className="size-4" />
                <span className="hidden sm:inline">Profil</span>
              </Link>
              <button
                type="button"
                onClick={handleLogout}
                className="flex items-center gap-1.5 rounded-md px-3 py-2 text-sm font-medium text-neutral-700 hover:bg-neutral-100 hover:text-neutral-900 dark:text-neutral-300 dark:hover:bg-neutral-800 dark:hover:text-white"
              >
                <LogOut className="size-4" />
                <span className="hidden sm:inline">Çıkış</span>
              </button>
            </>
          ) : (
            <>
              <Button variant="ghost" size="sm" asChild>
                <Link href="/auth/login">Giriş</Link>
              </Button>
              <Button
                asChild
                size="sm"
                className="rounded-md bg-gradient-to-r from-blue-500 to-blue-400 text-white shadow-sm hover:from-blue-600 hover:to-blue-500 dark:from-blue-600 dark:to-blue-500 dark:hover:from-blue-700 dark:hover:to-blue-600"
              >
                <Link href="/auth/register">Kayıt</Link>
              </Button>
            </>
          )}
        </div>
      </div>
    </header>
  );
 }
--- a/components/providers/session-provider.tsx
+++ b/components/providers/session-provider.tsx
@@ -0,0 +1,8 @@
 "use client";
 import { SessionProvider as NextAuthSessionProvider } from "next-auth/react";
 import type { ReactNode } from "react";
 export function SessionProvider({ children }: { children: ReactNode }) {
  return <NextAuthSessionProvider>{children}</NextAuthSessionProvider>;
 }
--- a/components/theme-provider.tsx
+++ b/components/theme-provider.tsx
@@ -0,0 +1,46 @@
 "use client";
 import React, { createContext, useContext, useEffect, useState } from "react";
 type Theme = "light" | "dark";
 const ThemeContext = createContext<{
  theme: Theme;
  setTheme: (theme: Theme) => void;
  toggleTheme: () => void;
 } | null>(null);
 const STORAGE_KEY = "techwix-theme";
 export function ThemeProvider({ children }: { children: React.ReactNode }) {
  const [theme, setThemeState] = useState<Theme>("light");
  const [mounted, setMounted] = useState(false);
  useEffect(() => {
    const isDark = document.documentElement.classList.contains("dark");
    setThemeState(isDark ? "dark" : "light");
    setMounted(true);
  }, []);
  const setTheme = (next: Theme) => {
    setThemeState(next);
    localStorage.setItem(STORAGE_KEY, next);
    document.documentElement.classList.toggle("dark", next === "dark");
  };
  const toggleTheme = () => {
    setTheme(theme === "dark" ? "light" : "dark");
  };
  return (
    <ThemeContext.Provider value={{ theme, setTheme, toggleTheme }}>
      {children}
    </ThemeContext.Provider>
  );
 }
 export function useTheme() {
  const ctx = useContext(ThemeContext);
  if (!ctx) throw new Error("useTheme must be used within ThemeProvider");
  return ctx;
 }
--- a/components/theme-toggle.tsx
+++ b/components/theme-toggle.tsx
@@ -0,0 +1,25 @@
 "use client";
 import React from "react";
 import { Moon, Sun } from "lucide-react";
 import { useTheme } from "@/components/theme-provider";
 export function ThemeToggle() {
  const { theme, toggleTheme } = useTheme();
  return (
    <button
      type="button"
      onClick={toggleTheme}
      className="rounded-md p-2 text-neutral-600 hover:bg-neutral-100 hover:text-neutral-900 dark:text-neutral-400 dark:hover:bg-neutral-800 dark:hover:text-white"
      aria-label={theme === "dark" ? "Aydınlık temaya geç" : "Koyu temaya geç"}
      title={theme === "dark" ? "Aydınlık tema" : "Koyu tema"}
    >
      {theme === "dark" ? (
        <Sun className="size-5" />
      ) : (
        <Moon className="size-5" />
      )}
    </button>
  );
 }
--- a/components/ui/button.tsx
+++ b/components/ui/button.tsx
@@ -0,0 +1,64 @@
 import * as React from "react"
 import { cva, type VariantProps } from "class-variance-authority"
 import { Slot } from "radix-ui"
 import { cn } from "@/lib/utils"
 const buttonVariants = cva(
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
  {
    variants: {
      variant: {
        default: "bg-primary text-primary-foreground hover:bg-primary/90",
        destructive:
          "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
        outline:
          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
        secondary:
          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
        ghost:
          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
        link: "text-primary underline-offset-4 hover:underline",
      },
      size: {
        default: "h-9 px-4 py-2 has-[>svg]:px-3",
        xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
        icon: "size-9",
        "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
        "icon-sm": "size-8",
        "icon-lg": "size-10",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "default",
    },
  }
 )
 function Button({
  className,
  variant = "default",
  size = "default",
  asChild = false,
  ...props
 }: React.ComponentProps<"button"> &
  VariantProps<typeof buttonVariants> & {
    asChild?: boolean
  }) {
  const Comp = asChild ? Slot.Root : "button"
  return (
    <Comp
      data-slot="button"
      data-variant={variant}
      data-size={size}
      className={cn(buttonVariants({ variant, size, className }))}
      {...props}
    />
  )
 }
 export { Button, buttonVariants }
--- a/components/ui/input.tsx
+++ b/components/ui/input.tsx
@@ -0,0 +1,22 @@
 import * as React from "react";
 import { cn } from "@/lib/utils";
 const Input = React.forwardRef<
  HTMLInputElement,
  React.ComponentProps<"input">
 >(({ className, type, ...props }, ref) => {
  return (
    <input
      type={type}
      className={cn(
        "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 dark:border-input dark:bg-input/10",
        className
      )}
      ref={ref}
      {...props}
    />
  );
 });
 Input.displayName = "Input";
 export { Input };
--- a/components/ui/label.tsx
+++ b/components/ui/label.tsx
@@ -0,0 +1,19 @@
 import * as React from "react";
 import { cn } from "@/lib/utils";
 const Label = React.forwardRef<
  HTMLLabelElement,
  React.ComponentProps<"label">
 >(({ className, ...props }, ref) => (
  <label
    ref={ref}
    className={cn(
      "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
      className
    )}
    {...props}
  />
 ));
 Label.displayName = "Label";
 export { Label };
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -0,0 +1,18 @@
 import { defineConfig, globalIgnores } from "eslint/config";
 import nextVitals from "eslint-config-next/core-web-vitals";
 import nextTs from "eslint-config-next/typescript";
 const eslintConfig = defineConfig([
  ...nextVitals,
  ...nextTs,
  // Override default ignores of eslint-config-next.
  globalIgnores([
    // Default ignores of eslint-config-next:
    ".next/**",
    "out/**",
    "build/**",
    "next-env.d.ts",
  ]),
 ]);
 export default eslintConfig;
--- a/lib/auth-api.ts
+++ b/lib/auth-api.ts
@@ -0,0 +1,176 @@
 /**
 * Auth API client for login, register, me, refresh.
 * Uses NEXT_PUBLIC_BASE_API_URL on client (defaults to same as BASE_API_URL for server).
 */
 const getBaseUrl = () =>
  typeof window !== "undefined"
    ? process.env.NEXT_PUBLIC_BASE_API_URL ?? "http://127.0.0.1:8080"
    : process.env.BASE_API_URL ?? process.env.NEXT_PUBLIC_BASE_API_URL ?? "http://127.0.0.1:8080";
 const API_PREFIX = "/api/v1/auth";
 export interface AuthUser {
  id: number;
  email: string;
  first_name: string;
  last_name: string;
  username?: string;
  is_admin: boolean;
  email_verified?: boolean;
 }
 export interface LoginResponse {
  access_token: string;
  refresh_token: string;
  user: AuthUser;
 }
 export interface RegisterResponse {
  message: string;
  user: AuthUser;
 }
 export interface RefreshResponse {
  access_token: string;
  refresh_token: string;
 }
 /** POST /api/v1/auth/login – doğrudan backend (token client’ta; cookie için loginViaCookie kullanın) */
 export async function login(
  email: string,
  password: string
 ): Promise<LoginResponse> {
  const base = getBaseUrl();
  const res = await fetch(`${base}${API_PREFIX}/login`, {
    method: "POST",
    headers: { "Content-Type": "application/json", accept: "application/json" },
    body: JSON.stringify({ email, password }),
  });
  if (!res.ok) {
    const err = await res.json().catch(() => ({}));
    throw new Error((err as { detail?: string }).detail ?? "Giriş başarısız");
  }
  return res.json();
 }
 /** Cookie tabanlı giriş – token’lar HTTP-only secure cookie’de saklanır */
 export async function loginViaCookie(
  email: string,
  password: string
 ): Promise<{ user: AuthUser }> {
  const res = await fetch("/api/auth/cookie-login", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({ email: email.trim(), password }),
    credentials: "include",
  });
  const data = await res.json().catch(() => ({}));
  if (!res.ok) {
    throw new Error((data as { error?: string }).error ?? "Giriş başarısız");
  }
  return data as { user: AuthUser };
 }
 /** Cookie tabanlı çıkış */
 export async function logoutViaCookie(): Promise<void> {
  await fetch("/api/auth/cookie-logout", {
    method: "POST",
    credentials: "include",
  });
 }
 /** Cookie oturumunu kontrol et (client tarafında oturum bilgisi için) */
 export async function getCookieSession(): Promise<{
  loggedIn: boolean;
  user?: AuthUser;
 }> {
  const res = await fetch("/api/auth/cookie-session", { credentials: "include" });
  const data = await res.json().catch(() => ({ loggedIn: false }));
  return data as { loggedIn: boolean; user?: AuthUser };
 }
 /** POST /api/v1/auth/register */
 export async function register(body: {
  email: string;
  first_name: string;
  last_name: string;
  password: string;
  username: string;
 }): Promise<RegisterResponse> {
  const base = getBaseUrl();
  const res = await fetch(`${base}${API_PREFIX}/register`, {
    method: "POST",
    headers: { "Content-Type": "application/json", accept: "application/json" },
    body: JSON.stringify(body),
  });
  if (!res.ok) {
    const err = await res.json().catch(() => ({}));
    const detail = (err as { detail?: string | string[] }).detail;
    const message = Array.isArray(detail) ? detail.join(" ") : detail ?? "Kayıt başarısız";
    throw new Error(message);
  }
  return res.json();
 }
 /** GET /api/v1/auth/me */
 export async function me(accessToken: string): Promise<{ user: AuthUser }> {
  const base = getBaseUrl();
  const res = await fetch(`${base}${API_PREFIX}/me`, {
    headers: {
      accept: "application/json",
      Authorization: `Bearer ${accessToken}`,
    },
  });
  if (!res.ok) throw new Error("Oturum bilgisi alınamadı");
  return res.json();
 }
 /** POST /api/v1/auth/refresh */
 export async function refresh(refreshToken: string): Promise<RefreshResponse> {
  const base = getBaseUrl();
  const res = await fetch(`${base}${API_PREFIX}/refresh`, {
    method: "POST",
    headers: { "Content-Type": "application/json", accept: "application/json" },
    body: JSON.stringify({ refresh_token: refreshToken }),
  });
  if (!res.ok) throw new Error("Token yenilenemedi");
  return res.json();
 }
 const ACCESS_KEY = "auth_access_token";
 const REFRESH_KEY = "auth_refresh_token";
 const AUTH_CHANGE_EVENT = "auth-change";
 /** Header vb. bileşenlerin oturum değişikliğini algılaması için tetiklenir. */
 export function notifyAuthChange(): void {
  if (typeof window === "undefined") return;
  window.dispatchEvent(new Event(AUTH_CHANGE_EVENT));
 }
 export function setTokens(access: string, refreshToken: string): void {
  if (typeof window === "undefined") return;
  localStorage.setItem(ACCESS_KEY, access);
  localStorage.setItem(REFRESH_KEY, refreshToken);
  notifyAuthChange();
 }
 export function getAccessToken(): string | null {
  if (typeof window === "undefined") return null;
  return localStorage.getItem(ACCESS_KEY);
 }
 export function getRefreshToken(): string | null {
  if (typeof window === "undefined") return null;
  return localStorage.getItem(REFRESH_KEY);
 }
 export function clearTokens(): void {
  if (typeof window === "undefined") return;
  localStorage.removeItem(ACCESS_KEY);
  localStorage.removeItem(REFRESH_KEY);
  notifyAuthChange();
 }
 export { AUTH_CHANGE_EVENT };
--- a/lib/auth-cookies.ts
+++ b/lib/auth-cookies.ts
@@ -0,0 +1,25 @@
 /**
 * Cookie adları ve ayarları – JWT için HTTP-only secure cookie.
 * Sadece sunucu tarafında (API route) kullanılır.
 */
 const COOKIE_ACCESS = "auth_access_token";
 const COOKIE_REFRESH = "auth_refresh_token";
 const isProd = process.env.NODE_ENV === "production";
 const COOKIE_OPTS = {
  httpOnly: true,
  secure: isProd,
  sameSite: "lax" as const,
  path: "/",
 };
 const ACCESS_MAX_AGE = 24 * 60 * 60; // 1 gün
 const REFRESH_MAX_AGE = 30 * 24 * 60 * 60; // 30 gün
 export {
  COOKIE_ACCESS,
  COOKIE_REFRESH,
  COOKIE_OPTS,
  ACCESS_MAX_AGE,
  REFRESH_MAX_AGE,
 };
--- a/lib/auth-options.ts
+++ b/lib/auth-options.ts
@@ -0,0 +1,53 @@
 import type { NextAuthOptions } from "next-auth";
 import GoogleProvider from "next-auth/providers/google";
 import GitHubProvider from "next-auth/providers/github";
 /**
 * NextAuth options: Google & GitHub OAuth.
 * Env: NEXTAUTH_SECRET veya NEXT_AUTH_SECRET, NEXTAUTH_URL,
 * GOOGLE_CLIENT_ID, GOOGLE_CLIENT_SECRET,
 * GITHUB_CLIENT_ID, GITHUB_CLIENT_SECRET
 */
 const isProd = process.env.NODE_ENV === "production";
 export const authOptions: NextAuthOptions = {
  secret: process.env.NEXTAUTH_SECRET ?? process.env.NEXT_AUTH_SECRET,
  useSecureCookies: isProd,
  cookies: {
    sessionToken: {
      name: `${isProd ? "__Secure-" : ""}next-auth.session-token`,
      options: {
        httpOnly: true,
        sameSite: "lax",
        path: "/",
        secure: isProd,
        maxAge: 30 * 24 * 60 * 60, // 30 gün
      },
    },
  },
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID ?? "",
      clientSecret: process.env.GOOGLE_CLIENT_SECRET ?? "",
    }),
    GitHubProvider({
      clientId: process.env.GITHUB_CLIENT_ID ?? "",
      clientSecret: process.env.GITHUB_CLIENT_SECRET ?? "",
      authorization: {
        params: {
          scope: "user:email",
        },
      },
    }),
  ],
  pages: {
    signIn: "/auth/login",
  },
  callbacks: {
    redirect({ url, baseUrl }) {
      if (url.startsWith("/")) return `${baseUrl}${url}`;
      if (new URL(url).origin === baseUrl) return url;
      return baseUrl;
    },
  },
 };
--- a/lib/utils.ts
+++ b/lib/utils.ts
@@ -0,0 +1,6 @@
 import { clsx, type ClassValue } from "clsx"
 import { twMerge } from "tailwind-merge"
 export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
 }
--- a/next.config.ts
+++ b/next.config.ts
@@ -0,0 +1,7 @@
 import type { NextConfig } from "next";
 const nextConfig: NextConfig = {
  /* config options here */
 };
 export default nextConfig;
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,36 @@
 {
  "name": "next-fiber",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "eslint"
  },
  "dependencies": {
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "lucide-react": "^0.575.0",
    "next": "16.1.6",
    "next-auth": "^4.24.13",
    "next-themes": "^0.4.6",
    "nextjs-turnstile": "^1.0.3",
    "radix-ui": "^1.4.3",
    "react": "19.2.3",
    "react-dom": "19.2.3",
    "tailwind-merge": "^3.5.0"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "eslint": "^9",
    "eslint-config-next": "16.1.6",
    "shadcn": "^3.8.5",
    "tailwindcss": "^4",
    "tw-animate-css": "^1.4.0",
    "typescript": "^5"
  }
 }
--- a/postcss.config.mjs
+++ b/postcss.config.mjs
@@ -0,0 +1,7 @@
 const config = {
  plugins: {
    "@tailwindcss/postcss": {},
  },
 };
 export default config;
--- a/public/file.svg
+++ b/public/file.svg
@@ -0,0 +1 @@
 <svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
--- a/public/globe.svg
+++ b/public/globe.svg
@@ -0,0 +1 @@
 <svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
--- a/public/next.svg
+++ b/public/next.svg
@@ -0,0 +1 @@
 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
--- a/public/vercel.svg
+++ b/public/vercel.svg
@@ -0,0 +1 @@
 <svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>
--- a/public/window.svg
+++ b/public/window.svg
@@ -0,0 +1 @@
 <svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,34 @@
 {
  "compilerOptions": {
    "target": "ES2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "react-jsx",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    ".next/types/**/*.ts",
    ".next/dev/types/**/*.ts",
    "**/*.mts"
  ],
  "exclude": ["node_modules"]
 }
		`@@ -0,0 +1 @@`
							`<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>`
		`@@ -0,0 +1 @@`
							<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
		`@@ -0,0 +1 @@`
							<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
		`@@ -0,0 +1 @@`
							`<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>`