🇬🇧
Zurück zu Referenzen
SAP Logo

KulturPass DE

SAP SE

Senior React Native Developer

Hinweis: Das KulturPass Programm wurde Ende 2025 eingestellt. App und Web-Services wurden am 30. November 2025 abgeschaltet, Einlösungen waren bis 15. Dezember 2025 möglich. Mehr erfahren

KulturPass war eine deutsche Regierungsinitiative, die allen 18-Jährigen in Deutschland ein digitales Budget von 200 EUR für kulturelle Angebote wie Bücher, Konzerttickets, Museumsbesuche und mehr bereitstellte. Die App ermöglichte es jungen Erwachsenen, kulturelle Angebote von teilnehmenden Anbietern zu entdecken und einzulösen.

Projektüberblick

Ich habe an der Entwicklung der KulturPass Mobile-App mit React Native mitgearbeitet. Als Teil des SAP-Teams implementierte ich Kernfeatures wie das Favoriten-System, Formularvalidierung, Secure Storage und die State- Management-Architektur. Die App integriert den Personalausweis für die Identitätsprüfung und verbindet sich mit einem Commerce-Backend für Angebotssuche und Einlösung.

Wichtige Beiträge

Favoriten-System

Das komplette Favoriten-Feature gebaut, mit dem Nutzer kulturelle Angebote speichern und verwalten können. Listenansicht mit Produktbildern, Preis-Badges und Swipe-Delete-Aktionen umgesetzt. Umfangreiche Accessibility- Labels für Screenreader und Tests hinzugefügt.

Formularvalidierung

Client- und Server-seitige Formularvalidierung für Login- und Registrierung mit React Hook Form und Zod implementiert. Robustes Error-Handling mit übersetzten Validierungsnachrichten je Feld und korrekter Integration von CDC API Error Responses aufgebaut.

Secure Storage

Verschlüsselten Storage für sensible Daten mit react-native-encrypted-storage eingerichtet. Layered Storage Architecture aufgebaut, die persistente Daten von sicheren Credentials trennt, inklusive sauberer Redux Persist Integration.

Redux State Management

Redux Architektur mit Redux Toolkit, Redux Saga für Side Effects und Redux Persist für State Persistence etabliert. Separate Storage Backends für normale und sensitive Daten konfiguriert, inklusive sauberer Serialisierung und Type Safety.

React Native Upgrade

Upgrade von React Native auf 0.70.x geführt, inklusive Hermes Engine Updates und Dependency-Migrationen. Breaking Changes gelöst, Build-Errors behoben und Security-Updates in Third-Party-Packages eingespielt.

Code-Qualität & Testing

Code-Qualität durch strengere ESLint-Regeln verbessert und TypeScript- Fehler über die Codebasis hinweg behoben. React Native Testing Library eingerichtet und umfangreiche Unit-Tests für Komponenten und Services geschrieben, inklusive Test-Patterns für das Team.

Environment-Konfiguration

Dynamisches Environment-Config-System gebaut, das Build-Konfigurationen aus YAML Dateien liest. Konfigurations-Picker UI für Dev-Builds umgesetzt, um zwischen Backend-Umgebungen zu wechseln.

API Error Handling

Error Registry System für konsistentes Error Handling erstellt. Error- Modals für API-Fehler mit korrektem Error-Code-Mapping und userfreundlichen Meldungen implementiert.

Registrierung & Authentifizierung

Preferences Screen für die Registrierung umgesetzt, inklusive Standort (PLZ) Eingabe mit Validierung. Forgot-Password-Flow mit Fehlerbehandlung und User-Feedback gebaut.

CI/CD Pipeline

Continuous Integration Pipelines für TypeScript Checks, ESLint und Jest Tests eingerichtet. Build Wrapper Repository für automatisierte App Builds und Distribution konfiguriert.

Technologie-Stack

Frontend

  • React Native 0.70
  • TypeScript
  • Redux Toolkit
  • Redux Saga
  • React Navigation
  • React Hook Form

Services

  • AppCenter Analytics
  • AppCenter Crashes
  • i18next
  • Axios

Security

  • Encrypted Storage
  • Zod Validation
  • AusweisApp2 SDK

DevOps

  • Jest
  • React Native Testing Library
  • ESLint
  • GitHub Actions

Weitere Beiträge

react-native-ausweisapp2-wrapper

Beitrag zum React Native Wrapper für das AusweisApp2 SDK, das die Integration des Personalausweises für sichere Identitätsprüfung in der App ermöglicht.