Das Fintech Unternehmen bietet über die Plattform bezahl.de eine komplexes und umfangreiches Zahlungsmanagement für die Automobilbranche an.

Hier sollte die bestehende und mit Vue 2 aufgebaute Oberfläche für Händler und Kunden auf Vue 3 mit TypeScript modernisiert werden.

Meine Aufgabe war die technische Leitung, Architektur, sowie die Unterstützung und Betreuung des Teams beim Aufbau des neuen Projektes.

Eine simplere Konvertierung von Vue 2 auf Vue 3 war auf Grund einiger mit Vue 3 nicht mehr kompatiblen externen Abhängigkeiten wie z. B. der Komponenten-Bibliothek Buefy nicht möglich. Deshalb musste die Anwendung fast vollständig neu entwickelt werden.

Für Komponenten wurde die SFC-Variante gewählt. Außerdem kam Vuetify.js als Komponentenbibliothek zum Einsatz, welches wir noch durch eigene Komponenten erweitert und optisch angepasst haben. Auf Wunsch des Kunden verwendeten wir in den Templates statt HTML die Sprache Pug.

Eine besondere Herausforderung waren die Komplexität und der Umfang der Anwendung, welche eine tiefe Einarbeitung in die bestehenden Lösungen erforderte. Hierbei waren die Anbindung und die korrekte Typisierung der bestehenden Rest-Api Schnittstellen basierend auf Node.js mit Express-Framework eine der komplexesten Aufgaben. So wurden für jeden Api-Endpunkt thematisch aufgeteilte Service TypeScript Module erstellt, die alle relevanten Api-Endpunkte enthalten. Darüber hinaus haben wir Anpassungen und Erweiterungen an der API vorgenommen.

Verwendete Technologien: TypeScript, JavaScript, Vue 2, Vue 3, Node.js, Express-Framework, SCSS, Pug, HTML, SVG, Docker

Meine Aufgabe umfasste die Unterstützung bei der Weiterentwicklung der Management-Software der Hardware-Lösungen sowie die Migration von Vue2 Class-Based-Components auf Vue3 Setup-Pattern mit TypeScript.

Besondere Herausforderung bei dem Projekt war die immense Größe, wodurch bei allen Modernisierungen und Refactorings stets abgewogen werden musste, ob bestehende Komponenten um oder gleich komplett neu geschrieben werden sollten.

Die komplexeste von mir umgesetzte Lösung war eine zentralisierte Validierung von Formularen und Wizards, die die Validierung der API widerspiegeln sollte. Diese neue Mechanik wurde durch das gesamte Projekt hindurch implementiert und lieferte lokalisierte Fehlermeldungen noch vor dem Absenden der Formulare.

Alle implementierten Features und Bugfixes wurden ausgiebig mit dem neuen Testframework Vitest getestet.

Verwendete Technologien:

VueJs 3, TypeScript, Vite, Scss, Node.js, Websockets, Vitest

Das Unternehmen Talkevent entwickelt Chat-Lösungen für Sparkassen, Banken und Versicherungen, um Beratern einen vielfältigen und einfachen digitalen Kontakt zum Kunden zu ermöglichen.

Die Lösungen umfassen Text-Chat, Audio-Chat, Video-Chat, Co-Browsing, Whiteboards, Screen-Sharing und File-Sharing. Alle Gespräche können archiviert werden, wobei persönliche Informationen entfernt werden.

Meine Aufgabe im Projekt umfasste die Modernisierung des Front- und Backends.

Das Frontend ist mit Vue 2 umgesetzt worden und sollte auf Vue 3 mit Typescript und Setup-Pattern umgestellt werden. Auch hier wurden alle Dependencies auf die neueste Version aktualisiert.

Herausforderung bei beiden Projekten war die schiere Größe, wodurch für viele Schritte, die sonst manuell umgesetzt werden, automatisierte Lösungen gefunden oder entwickelt werden mussten. Dies umfasste z. B. Patch-Scripte zur Umkonvertierung von Code.

Verwendete Technologien:

VueJs 3, TypeScript, Vite, Scss, Node.js, Express Framework, Mongoose, MongoDb, Vitest, Websockets

Für dieses Projekt wurde ich engagiert, um mit VueJs 3 eine Oberfläche zur Artikelrecherche für Kliniken im Stile einer E-Commerce Plattform umzusetzen. Mein Auftraggeber war die Advellence GmbH, die von der Sana Kliniken AG den Auftrag für dieses Projekt erhalten hat. Ich wurde unterstützend als Frontend-Experte hinzugezogen, habe aber auch recht zügig in Backend-Themen intensiv unterstützt.

Das Frontend-Projekt wurde zunächst mit VueJs 3 Options Api, Vue Cli 4, Vue-I18n, Jest, SASS (BEM), Vue-Router und VueX umgesetzt. Später erfolgte allerdings eine Modernisierung, bei der auf die Composition Api mit Single File Components (Setup Pattern) refactored wurde. Außerdem wurde VueX durch Pinia ersetzt und Vue Cli mit Vite. Das Design kam von einer weiteren Agentur und wurde in enger Zusammenarbeit mit der Designerin präzise umgesetzt. Später erfolgte noch die Anbindung einer Authentifizierung über GLUU anhand des OpenID-Standards.

Ein weiteres Projekt war die Erstellung von Exporten in Form von CSV-Dateien aus dem dahinterliegenden PIM über Azure Data Factories. Meine Aufgabe war es, die Pipelines und Dataflows zur Datentransformation und -Komposition zu modellieren.

Bei größeren Downloads war es ggf. notwendig, die Artikel-IDs erst zu ermitteln, was aufgrund der Laufzeiten clientseitig nicht möglich war. Deshalb habe ich zu diesem Zweck eine Azure Logic App entwickelt, die alle IDs (bis zu 500.000) einsammelt und den Download für den Client startet.

Des Weiteren unterstütze ich das Team bei der Erweiterung eines Kunden internen Tools zur Preispflege. Hierbei handelte es sich um ein VueJs Projekt, dass über Azure Funktions (C#) mit Daten versorgt wurde. Meine Aufgabe war die Erweiterung des VueJs Frontends, sowie des C# Backends.

Bei dem Projekt handelt es sich um eine Administrationsoberfläche für das später in der Liste aufgeführte Dashbo Projekt, bei dem Administratoren Dashboard Projekte konfigurieren und Datenquellen festlegen können.

Das Frontend ist technisch sehr ähnlich zu dem zuvor aufgeführten Projekt. Hier wird ebenfalls VueJs 3 auf Basis von TypeScript verwendet. Allerdings kommt zusätzlich TailwindUI und TailwindCss zum Einsatz.

Das Backend basiert auf NodeJs mit dem Express Framework ebenfalls mit TypeScript. Die Rest Api wird über Swagger dokumentiert. Über weitere an das Backend angeschlossene Technologien kann ich auf Grund der NDA keine Auskünfte geben.

Frontend und Backend sind beide cloud ready und werden in der AWS Cloud betrieben.

Für das junge Startup sollte eine App samt Backend entwickelt werden, um Sportveranstaltungen digital und vor Ort online anzubieten. Gemäß Corona Verordnungen, mussten auch ggf. persönliche Daten erfasst werden.

Die App enthält folgende Features:

• Erstellung von Terminen (online & vor Ort)

• Zuweisung von Trainern / Hostern

• On-Demand Abrechnung für Termine oder Abos

• Broadcasting von Termin Updates,

• Transaktionale E-mails und Push-Notifications

• Social Logins (SSO)

Technische Komponenten:

Als Backend dient eine Rest API auf C# (.NET5) Basis die über EF Core and eine MySQL 8 Datenbank angebunden ist.

Das Frontend ist eine auf VueJs 3 (mit TypeScript) basierende PWA.

Frontend und Backend sind cloud ready und laufen momentan auf einer AWS EC2 Instance, können aber jederzeit in einen Dynamic Container Service gepackt und ein Load Balancer mit Autoscaling davor geschaltet werden.

Push Notifications werden mit SignalR über WebSockets and die App übertragen. Diese beinhalten On Action Notifications, sowie On Time Notifications. Desweiteren läuft ein automatisierter Dienst zum Versand von transaktionalen E-Mails.

Verwendete Technologien:

C# .NET 5.0, EF Core, VueJs 3, TypeScript, Vue Cli, Sass, PWA, PayPa Checkout, PayPal Subscriptions, Stripe, Service Worker, SignalR

Bei CHRONEXT habe ich als Hauptentwickler im Bereich E-Commerce das ganze Shop System bis zum Mai 2019 entwickelt.

Das Backend war eine komplette Eigenentwicklung und basierte auf dem Slim Framework und wurde mit PHP 5.6 gestartet und später auf 7.1 upgedatet.

Als Datenbank wurde Mysql 5.7 verwendet. Zusätzlich wurde für die Produktsuche Algolia angebunden. Dabei handelt es sich um einen Dienstleister, der hochperformante Suchabfragen bei hohem Datenvolumen erlaubt. Technisch wird im Hintergrund eine Elastic Search mit einer MongoDB verwendet. Zusätzlich wird der Dienst durch AI unterstützt.

Da zu dem Zeitpunkt moderne Frontend Frameworks wie Nuxt oder Next noch nicht etabliert waren, wurde das Frontend hier serverseitig gerendert und zusätzlich durch jQuery für die dynamischen Elemente unterstützt.

Besondere Herausforderungen waren die hohen SEO Anforderungen (Meta-Data, Google Structured Data, Sitemap Generation, etc.), sowie die Anbindung externer Tracking Tools und Zahlungsanbieter (PayPal, Finetrade, SOFORTÜberweisung, etc.)

Hinzu kamen Monitoring und Administrations-Tools für das Shop System, die im Backend mit Symfony 4 und im Frontend mit Vue Js 2 (Options Api) aufgebaut wurden. Auch die Produktdatenpflege wurde hier mit einer auf die eben genannten Technologien basierten Anwendung umgesetzt, die primär durch mich entwickelt wurde.