Fallstudien

Ausgewählte produktive Bereiche, an denen ich in Fintech-Anwendungen gearbeitet habe.

01Realtime · Fintech
Fintech-Interfaces in Echtzeit
Frontend Engineer
Partner panel
Fintech
PROBLEM
Dem internen Admin-Panel fehlte eine kohärente Ansicht der Kundenkonten. Portfolio-Daten, Asset-Preise und Transaktionshistorie waren auf separate Bildschirme verteilt, ohne Möglichkeit zwischen Ebenen zu navigieren oder Handelsaktionen direkt aus dem Portfolio-View zu starten.
ANSATZ
Entwickelte eine mehrstufige Portfolio-Ansicht mit animierten Konto-Drawern, Asset-Detail-Panels mit Preis und Transaktionshistorie sowie Transaktionstabellen mit Typenfilterung. Portfolio-Werte, Asset-Preise und Tabelleninhalte werden über WebSockets synchronisiert, sodass die Daten immer den aktuellen Marktstatus widerspiegeln.
ERGEBNIS
Nutzer können jetzt vom vollständigen Portfolio eines Kunden bis zu einem bestimmten Asset navigieren und Kauf- oder Verkaufsflows direkt aus dem Asset-Detail-Panel starten, mit vorausgefülltem Wallet und Asset. Alle Daten aktualisieren sich in Echtzeit ohne manuelles Aktualisieren.
- React
- TypeScript
- Redux Toolkit
- React Query
- REST API
- WebSockets
02Financial Flows
Mehrstufige Finanzprozesse
Frontend Engineer
Trading
SEPA
PROBLEM
Benutzer mussten Asset-Trades und Bank-Auszahlungen aus der Anwendung heraus durchführen können. Beide Flows teilen oberflächliche UI-Muster, haben aber völlig unterschiedliche Business-Logik, Validierungsregeln, Datenmodelle und Backend-Operationszustände, was eine gemeinsame Implementierung unpraktisch macht.
ANSATZ
Entwarf und entwickelte zwei unabhängige dreistufige Flows: ein Asset-Trading-Modal (Kauf/Verkauf) und ein Bank-Auszahlungssystem, jedes mit eigenen Zod-Validierungsschemata, State-Machine und Fehlerbehandlung. Beide reagieren auf echte Backend-Bestätigungen über WebSockets statt nur auf die initiale Request-Antwort.
ERGEBNIS
Beide Flows behandeln Edge Cases korrekt, darunter fehlgeschlagene Transaktionen, Zwischenzustände und Netzwerkunterbrechungen, alles gesteuert durch Live-WebSocket-Events. Die bewusste Trennung hält jeden Flow unabhängig wartbar und testbar.
- React
- TypeScript
- React Query
- REST API
- WebSockets
- Zod
03Admin Systems
Administrationssysteme und Kunden-Onboarding
Frontend Engineer
Admin panel
Partner portal
PROBLEM
Administrative Operationen erforderten komplexe mehrstufige Formulare mit regulatorischen Compliance-Anforderungen. Die Suche in großen Benutzerdatensätzen generierte übermäßige API-Aufrufe durch eine fehlende Debounce-Strategie.
ANSATZ
Implementierte den vollständigen Konto-Lebenszyklus mit Statusänderungen, Zugriffskontrolle, Kontoschließung und Konto-Zugriffswiederherstellung. Beim Kunden-Onboarding baute ich mehrstufige Formulare mit Zod-Validierung und integrierte strukturierte Compliance-Daten. Fügte einen 500-ms-Debounce zum Suchinput hinzu, um redundante API-Aufrufe zu reduzieren.
ERGEBNIS
Suchdebouncing reduzierte die API-Last bei Benutzersuchen erheblich. Mehrstufige Onboarding-Formulare mit Zod-Validierung verhindern ungültige Einreichungen und bieten klares Feedback auf jeder Stufe. Der vollständige Konto-Lebenszyklus ist abgedeckt, einschließlich Randzustände wie Konto-Zugriffswiederherstellung.
- React
- TypeScript
- Redux Toolkit
- REST API
- WebSockets
- Zod
04Tax & Compliance
Steuerverwaltung und Dokumentflows
Frontend Engineer
Tax
Compliance
PROBLEM
Kunden mussten Steuerhistorie einsehen, Steuerjahre auswählen und Steuer-Anträge verwalten, aber die UI hatte keinen Mechanismus zur Synchronisierung mit Backend-Operationszuständen während mehrstufiger Workflows. Das Einreichen eines Antrags lieferte keine genaue Rückmeldung über den Erfolg.
ANSATZ
Implementierte Kundensteuerhistorie-Ansichten, Steuerjahresauswahl, Steuerdokumenttabellen und vollständige Flows zum Erstellen und Bearbeiten von Anträgen. Daten und UI-Zustände werden durch WebSocket-Antworten gesteuert, sodass jede Ansicht den aktuellen Backend-Operationsstatus genau widerspiegelt.
ERGEBNIS
Der Steuer-Antrags-Flow behandelt alle Zwischenzustände von der Einreichung bis zur Backend-Bestätigung ohne Seitenaktualisierung. WebSocket-gesteuerte Updates eliminierten die Verzögerung zwischen Benutzeraktion und UI-Feedback, wodurch Kunden auf jeder Stufe einen genauen Status erhalten.
- React
- TypeScript
- Redux Toolkit
- React Query
- WebSockets
- Zod
05Marketing & CMS
Mehrsprachige Landing Pages und CMS-betriebene Websites
Frontend Engineer
Next.js
Strapi
Turborepo
SEO
Analytics
PROBLEM
Zwei mehrsprachige Marketing-Websites mussten innerhalb eines gemeinsamen Turborepo-Ökosystems gepflegt und weiterentwickelt werden. Beide nutzten CMS-verwaltete Inhalte, Cookie-Consent, Google Analytics, responsive Layouts und eine konsistente Struktur über mehrere Locales. Eine Website musste von Grund auf entwickelt werden, während die zweite laufend weiterentwickelt werden sollte, ohne gemeinsame Frontend-Logik zu duplizieren.
ANSATZ
Entwickelte eine mehrsprachige Next.js-Marketing-Website von Grund auf und setzte die Entwicklung einer bestehenden zweiten Website im gleichen Turborepo-Ökosystem fort. Arbeitete mit CMS-gesteuerten Inhalten aus Strapi, implementierte responsive Landing-Abschnitte, Unterseiten, animierte Layouts und locale-bewusstes Frontend-Rendering. Extrahierte Cookie-Consent und Google Analytics in ein gemeinsames Turborepo-Paket, das von beiden Anwendungen über einen einzelnen Import und ein Konfigurationsobjekt genutzt wird. Der Fokus lag auf sauberer Informationsarchitektur, semantischem Markup, wiederverwendbaren Abschnitten, responsivem Verhalten, wartbaren Komponenten und produktionsreifer Implementierung.
ERGEBNIS
Beide Marketing-Websites teilen jetzt eine wiederverwendbare Cookie- und Analytics-Schicht ohne duplizierte Consent-Logik im Monorepo. Eine Website wurde von Grund auf mit mehreren Unterseiten, animierten Abschnitten und CMS-verwaltetem mehrsprachigem Content geliefert, während die zweite mit der gleichen gemeinsamen Frontend-Architektur weiterentwickelt wird. Das Setup erleichtert das Hinzufügen neuer Landing-Abschnitte, das Aktualisieren von CMS-Inhalten über alle Locales und die Konsistenz, Performance und Wartbarkeit der Marketing-Seiten.
- React
- Next.js
- TypeScript
- Strapi CMS
- Turborepo
- Tailwind CSS
- Framer Motion
- Google Analytics
- Cookie Consent
- SEO
- Responsive UI

Fallstudien

Fintech-Interfaces in Echtzeit

Mehrstufige Finanzprozesse

Administrationssysteme und Kunden-Onboarding

Steuerverwaltung und Dokumentflows

Mehrsprachige Landing Pages und CMS-betriebene Websites