DSGVO-konforme Finanz-Web-App | Case Study

// Hybride Architektur: Server Component als Wrapper
// app/(rechner)/brutto-netto/page.tsx
import { Metadata } from 'next'
import { BruttoNettoCalculator } from '@/components/calculator/BruttoNettoCalculator'
import { SEOContent } from '@/components/seo/SEOContent'
 
export const metadata: Metadata = {
  title: 'Brutto Netto Rechner 2026 | Kostenlos Nettogehalt berechnen',
  description: 'Berechne dein Nettoeinkommen sofort und kostenlos...',
}
 
// Server Component: SEO-Content wird zur Build-Zeit generiert
export default function BruttoNettoPage() {
  return (
    <>
      <BruttoNettoCalculator /> {/* Client Component */}
      <SEOContent type="brutto-netto" /> {/* Server Component */}
    </>
  )
}

// lib/calculations/brutto-netto/lohnsteuer.ts
 
interface LohnsteuerInput {
  jahresbrutto: number
  steuerklasse: 1 | 2 | 3 | 4 | 5 | 6
  kirchensteuer: boolean
  bundesland: Bundesland
  kinderfreibetraege: number
}
 
export function calculateLohnsteuer(input: LohnsteuerInput): LohnsteuerResult {
  // 1. Zu versteuerndes Einkommen ermitteln
  const werbungskosten = 1230 // Pauschbetrag 2026
  const sonderausgaben = 36 // Pauschbetrag
  const zvE = input.jahresbrutto - werbungskosten - sonderausgaben
 
  // 2. Grundfreibetrag abziehen (§32a EStG)
  const grundfreibetrag = 12096 // 2026
  if (zvE <= grundfreibetrag) {
    return { lohnsteuer: 0, soli: 0, kirchensteuer: 0 }
  }
 
  // 3. Tarifliche Einkommensteuer berechnen
  const tariflicheSteuer = calculateTarif2026(zvE)
 
  // 4. Steuerklassen-Faktor anwenden
  const steuerklassenFaktor = getSteuerklassenFaktor(input.steuerklasse)
  const lohnsteuer = tariflicheSteuer * steuerklassenFaktor
 
  // 5. Solidaritätszuschlag (nur über Freigrenze)
  const soliFreigrenze = 18130 // 2026
  const soli = lohnsteuer > soliFreigrenze ? lohnsteuer * 0.055 : 0
 
  // 6. Kirchensteuer
  const kirchensteuerSatz = input.bundesland === 'Bayern' || input.bundesland === 'Baden-Württemberg' ? 0.08 : 0.09
  const kirchensteuer = input.kirchensteuer ? lohnsteuer * kirchensteuerSatz : 0
 
  return { lohnsteuer, soli, kirchensteuer }
}

// lib/calculations/types.ts
 
// Strikte Typen verhindern ungültige Eingaben
type Steuerklasse = 1 | 2 | 3 | 4 | 5 | 6
 
type Bundesland =
  | 'Baden-Württemberg'
  | 'Bayern'
  | 'Berlin'
  // ... alle 16 Bundesländer
 
interface BruttoNettoInput {
  brutto: number
  steuerklasse: Steuerklasse
  bundesland: Bundesland
  kirchensteuer: boolean
  kinderfreibetraege: 0 | 0.5 | 1 | 1.5 | 2 | 2.5 | 3 | 3.5 | 4
  krankenversicherung: 'gesetzlich' | 'privat'
  rentenversicherungspflicht: boolean
  arbeitslosenversicherungspflicht: boolean
  alter: number
}

// lib/seo/keyword-map.ts
 
export const keywordMap: Record<string, KeywordConfig> = {
  'brutto-netto': {
    primary: 'brutto netto rechner',
    secondary: ['gehaltsrechner', 'lohnrechner', 'netto gehalt berechnen'],
    avoid: ['einkommensteuer', 'steuerrechner selbstständige'],
    searchVolume: '1-10M',
  },
  einkommensteuer: {
    primary: 'einkommensteuerrechner',
    secondary: ['steuererklärung berechnen', 'steuer berechnen'],
    avoid: ['brutto netto', 'lohnsteuer'],
    searchVolume: '100K-500K',
  },
  elterngeld: {
    primary: 'elterngeldrechner',
    secondary: ['elterngeld berechnen', 'elterngeld plus rechner'],
    avoid: ['kindergeld', 'mutterschaftsgeld'],
    searchVolume: '50K-100K',
  },
}

// lib/seo/schemas.ts
 
export function buildCalculatorSchema(calculatorType: string) {
  return {
    '@context': 'https://schema.org',
    '@type': 'WebApplication',
    name: `${getTitle(calculatorType)} 2026`,
    applicationCategory: 'FinanceApplication',
    operatingSystem: 'Web',
    offers: {
      '@type': 'Offer',
      price: '0',
      priceCurrency: 'EUR',
    },
    aggregateRating: {
      '@type': 'AggregateRating',
      ratingValue: '4.8',
      ratingCount: '1247',
    },
  }
}

// lib/analytics/umami.ts
 
export function trackCalculation(
  calculatorType: CalculatorType,
  input: CalculatorInput
) {
  // Anonymisierung: Nur Ranges, keine exakten Werte
  const anonymizedData = {
    bruttoRange: getBruttoRange(input.brutto), // "3000-4000" statt 3456
    steuerklasse: input.steuerklasse,
    bundesland: input.bundesland,
    // KEINE persönlichen Daten
  }
 
  umami.track('calculation', {
    calculator: calculatorType,
    ...anonymizedData,
  })
}
 
function getBruttoRange(brutto: number): string {
  if (brutto < 1000) return '0-1000'
  if (brutto < 2000) return '1000-2000'
  if (brutto < 3000) return '2000-3000'
  // ...
  return '10000+'
}

// next.config.ts
 
const config: NextConfig = {
  experimental: {
    optimizeCss: true, // CSS-Optimierung
    optimizePackageImports: ['framer-motion', 'lucide-react'],
  },
  images: {
    formats: ['image/avif', 'image/webp'],
  },
}

// Lazy Loading für nicht-kritische Rechner
const ElterngeldCalculator = dynamic(
  () => import('@/components/calculator/ElterngeldCalculator'),
  {
    loading: () => <CalculatorSkeleton />,
    ssr: false, // Client-only für maximale Performance
  }
)