ABL Configuration App
ABL GmbH
ABL ist ein deutscher Hersteller von Ladeinfrastruktur für Elektroautos und produziert Wallboxen sowie Ladestationen für Zuhause und Unternehmen. Die Configuration App ermöglicht Installateuren und Endnutzern das Einrichten, Konfigurieren und Verwalten von ABL Ladestationen über WiFi und Bluetooth.
Projektüberblick
Als hauptverantwortlicher Entwickler habe ich die ABL Configuration App seit den frühen Phasen aufgebaut und weiterentwickelt. Die App kommuniziert direkt mit ABL Wallboxen über lokale WiFi-Netze und Bluetooth, ermöglicht Device Setup, Firmware Updates, Netzwerk-Konfiguration und System-Management. Über 1.300+ Commits über mehrere Jahre hinweg, inklusive React Native Upgrades und kontinuierlicher Feature-Erweiterungen.
Wichtige Beiträge
Device Communication
Die zentrale Kommunikationsschicht für die Verbindung zu ABL Wallboxen via WiFi Access Point und lokale Netzwerke implementiert. Robuste Verbindungslogik mit Auto-Reconnect, Timeout-Management und Error Recovery gebaut. Die App betreibt einen lokalen HTTP Server für die Kommunikation.
QR Code Scanning
Kamera-basiertes QR-Scanning mit Vision Camera für Device Discovery und Onboarding integriert. Barcode Detection implementiert, Device-spezifische Kamera-Issues auf Samsung Geräten behandelt und Support für Ultrawide Linsen hinzugefügt. Manual Input als Fallback für unmögliche Scans.
Firmware Updates
Firmware-Update-System gebaut, das Over-the-Air Updates ermöglicht. Update Progress Tracking, Error Handling für hängende Updates und korrektes Device State Management umgesetzt.
Netzwerk-Konfiguration
Umfassende Setup-Flows für WiFi-Konfiguration, LTE/Mobile Daten und Ethernet (LAN) entwickelt. WiFi Password Management, Netzwerkwechsel und saubere Handhabung verschiedener Szenarien (AP Mode, LAN, Extender) implementiert.
Controller & Extender Management
System für Controller Devices und deren Extender (Satellite Charging Points) gebaut. Device Grouping, Extender Discovery via mDNS und Workflow für das Hinzufügen von Extendern zu Controller-Gruppen über LAN umgesetzt.
Multi-language Support
Internationalisierung mit i18next umgesetzt, inklusive Deutsch, Englisch, Französisch, Spanisch, Italienisch und Niederländisch. Integration mit Lokalise inklusive Upload/Download Scripts für Sync der Übersetzungen.
State Management
App State Architektur mit MobX für reaktives State Management gebaut. Stores für Device State, Controller Config, Connection Status und User Preferences implementiert. React Query für Server State und Caching hinzugefügt.
UI Components
Komponentenbibliothek mit NativeWind (Tailwind CSS für React Native) entwickelt. Reusable Components wie Custom Dropdowns, Loading Overlays, Modal Dialogs und Form Inputs mit React Hook Form Integration gebaut.
Error Tracking & Analytics
Sentry für Crash Reporting und Error Tracking mit Session Replay integriert. Mixpanel für Analytics hinzugefügt, um User Behavior und Connection Attempts zu tracken. Fehlerkontext und Tagging für durchsuchbare Logs umgesetzt.
React Native Upgrades
Mehrere React Native Version Upgrades (bis RN 0.75) durchgeführt. Breaking Changes behoben, native Dependencies aktualisiert, Xcode 15 Build Issues gelöst und Kompatibilität mit aktuellen iOS/Android Anforderungen gewährleistet.
Technologie-Stack
Mobile
- React Native 0.75
- TypeScript
- MobX
- React Query
- NativeWind
- React Navigation
Device Integration
- Vision Camera
- Local HTTP Server
- WiFi Management
- mDNS Discovery
Services
- Sentry
- Mixpanel
- i18next
- Lokalise
DevOps
- Fastlane
- Lefthook
- Jest
- MSW
- ESLint