lumina-nextjs-template/.claude/CLAUDE.md

Lumina Project - Claude Code Kontext

Projekt-Typ

Full-Stack Web-Applikation erstellt mit dem Lumina AI Development Platform Template.

Tech Stack

• Framework: Next.js 15 (App Router)
• Runtime: Node.js 20+
• Sprache: TypeScript (strict mode)
• Styling: Tailwind CSS
• UI Components: Spartan UI
• Backend/Database: Supabase (PostgreSQL)
• Auth: Supabase Auth
• Storage: Supabase Storage
• Package Manager: pnpm (bevorzugt) oder npm

Projekt-Struktur

/
├── app/                    # Next.js App Router
│   ├── api/               # API Routes
│   ├── (auth)/            # Auth-geschützte Routen
│   ├── layout.tsx         # Root Layout
│   ├── page.tsx           # Homepage
│   └── globals.css        # Globale Styles
├── components/            # React Components
│   ├── ui/               # Basis UI Components
│   └── ...               # Feature Components
├── lib/                   # Utilities & Services
│   ├── supabase.ts       # Supabase Client
│   └── utils.ts          # Helper Functions
├── public/               # Static Assets
├── helm/                 # Kubernetes Helm Charts
└── .claude/              # Claude Code Konfiguration

Coding Conventions

TypeScript

• Strict mode aktiviert
• Keine any Types - immer typisieren
• Interfaces für Objekte, Types für Unions/Primitives
• Barrel Exports aus index.ts vermeiden

React/Next.js

• Server Components als Default
• "use client" nur wenn nötig (interaktive Components)
• App Router Patterns verwenden
• Async Components für Data Fetching

Styling

• Tailwind CSS für alle Styles
• Keine inline styles
• cn() Helper für conditional classes
• Spartan UI Components wenn verfügbar

Supabase

• Server-Side: Service Role Key für Admin-Operationen
• Client-Side: Anon Key für User-Operationen
• Row Level Security (RLS) immer aktivieren
• Typen aus Database generieren

Wichtige Patterns

API Routes

// app/api/example/route.ts
import { NextRequest, NextResponse } from 'next/server';

export async function GET(request: NextRequest) {
  try {
    // Logic here
    return NextResponse.json({ data });
  } catch (error) {
    return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 });
  }
}

Supabase Server Client

import { createClient } from '@supabase/supabase-js';

// Server-side mit Service Role
const supabaseAdmin = createClient(
  process.env.SUPABASE_URL!,
  process.env.SUPABASE_SERVICE_ROLE_KEY!
);

Supabase Client

import { supabase } from '@/lib/supabase';

// Client-side Query
const { data, error } = await supabase
  .from('table_name')
  .select('*')
  .eq('column', 'value');

Environment Variables

Erforderlich:

• NEXT_PUBLIC_SUPABASE_URL - Supabase Project URL
• NEXT_PUBLIC_SUPABASE_ANON_KEY - Supabase Anonymous Key
• SUPABASE_SERVICE_ROLE_KEY - Supabase Service Role Key (Server-only)
• DATABASE_URL - PostgreSQL Connection String

Optional:

• REDIS_URL - Redis Cache
• ANTHROPIC_API_KEY - Claude API
• OPENAI_API_KEY - OpenAI API

NPM Scripts

• pnpm dev - Development Server (Port 3000)
• pnpm build - Production Build
• pnpm start - Production Server
• pnpm lint - ESLint Check
• pnpm format - Prettier Format

Deployment

Das Projekt unterstützt:

• Docker: Dockerfile vorhanden
• Kubernetes: Helm Charts in /helm
• Harbor: Image Registry Integration

Slash Commands

Verfügbare Claude Code Commands:

• /supabase-db - Datenbank-Operationen (CRUD, Migrations, Queries)
• /supabase-storage - Storage-Operationen (Upload, Download, Buckets)
• /supabase-auth - Authentication Setup & User Management
• /component - Neue UI Component erstellen
• /api - Neue API Route erstellen
• /deploy - Deployment Anleitung

Hinweise

1. Sicherheit: Niemals Service Role Key im Client-Code verwenden
2. RLS: Immer Row Level Security Policies definieren
3. Typen: Supabase Types mit supabase gen types generieren
4. Migrations: SQL Migrations in Supabase Dashboard oder via CLI