App Builder

EDR Software GmbH 2019 – 2021 Projektseite hier ansehen
A screenshot of the app builder app in a desktop browser Elements e e Dat e Qr cod scan e Ch ckbox e Attachm nt e S ction T e e R p tition group e T xt T T e Numb r 1 Outline Configuration e G o position Construction deficiencies Select your building site In that case, please inform Ian Schwarz on: 📞 +49 012345 678 910 Then drive to the depo and collect replacement windows Are all windows intact? yes no Select the area you have checked Front porch - FP0 Rooms checked Munich - MU0325 Field label - + In that case, please inform {{site-select.manager.name}} on: Telephone number Allow direct call? {{site-select.manager.phone}} Attachment

Das Problem

Kunden der EDR GmbH nutzten ausgedruckte Formulare, um Aufgaben und Abläufe wie Qualitätsprüfungen und Fehleranalysen auf Baustellen durchzuführen. Diese ausgedruckten Formulare waren oft umständlich, fehleranfällig und ineffizient.

Nachdem Anwender die ausgedruckten Dokumente manuell ausgefüllt hatten, musste jemand die Daten in eine Software wie Excel eingeben.

Existierende digitale Lösungen waren entweder zu schwer zu bedienen oder enthielten keine kritischen Funktionen, wie z. B. die Möglichkeit, bestimmte Formularfelder abhängig von den Eingaben des Benutzers auszublenden.

Die Mitarbeiter, die die Formulare ausfüllten, arbeiteten oft an Orten, an denen es nur eine sporadische oder gar keine Internetverbindung gab. In einem Fall mussten Bauarbeiter in Übersee Formulare ausfüllen, wo sie tagelang keinen Zugang zum Internet hatten.

Viele Anwendungsfälle erforderten, dass die Formulare regelmäßig aktualisiert werden mussten, um Änderungen der Richtlinien und der Geschäftslogik zu berücksichtigen. Geschäftslogik, die auch veränderte Variablen erforderte, die in den Anwendungen berücksichtigt werden mussten.

Meine Rolle

Nach ersten Gesprächen mit EDR, in denen ich meine Arbeit an früheren komplexen Lösungen, wie der Integration von Rules Engines (Randnotiz: schauen Sie sich meine TypeScript-Portierung der JSON Rules Engine an), sowie die Erstellung hochgradig interaktiver UIs in Angular schilderte, entschied EDR, dass ich die richtige Person für das Problem war.

Das Angular-Frontend und das NestJS-Backend sollten für die nächsten anderthalb Jahre mein virtueller Wohnsitz sein. Auch das Styling mit SCSS lag in meiner Verantwortung.

Da ich größtenteils allein an der Lösung arbeitete, konnte ich das, was EDR suchte, schnell entwickeln. Aufgrund dieser extra agilen Umgebung mit wenigen Besprechungen und schnellem Feedback hatte ich auch Zeit, mehrere NestJS-Microservices zu entwickeln, die von anderen von EDR entwickelten Anwendungen genutzt wurden.

Unsere Lösung

Wie es bei Unternehmen üblich ist, kann ich nicht zu sehr ins Detail gehen, was das Wie und das Was der technischen Umsetzung angeht. Trotzdem werde ich mein Bestes tun, um die Lösung zu vermitteln.

Der Name des Produkts verrät es schon – die Lösung erlaubt es dem Anwender, eigene Apps zu erstellen. Ich habe einen Drag-and-drop-editor gebaut, in dem der Anwender bestimmte App-Elemente in seine App ziehen und dann konfigurieren kann. Zu den Elementen gehören:

  • Text- und Zahleneingaben
  • Eine Unterschrifteingabe
  • Eine Fotoeingabe
  • Eine Wiederholungsgruppe, die die Wiederholung von anderen Elementen erlaubt
  • Eine Kartenanzeige

und viele mehr.

Sie können Abschnitte betiteln, Felder erforderlich machen, Validierung hinzufügen und sogar steuern, wann bestimmte Felder angezeigt und ausgeblendet werden.

Diese Apps können veröffentlicht, versioniert und anschließend an Personen versendet werden, die Daten in die erstellten Apps eingeben würden. Dadurch kann EDR die sich ständig ändernden Geschäftsanforderungen ihrer Kunden berücksichtigen. Ein Verfahren muss sofort geändert werden? Kein Problem. Nehmen Sie Änderungen an der App im App-Editor vor und veröffentlichen Sie sie erneut. Wenn Sie jemandem einen Link zur "neuesten Version" geschickt haben, wird er beim Öffnen der App immer die neueste Version der App sehen.

Aber was ist, wenn die Endanwender offline sind? Wir haben kurz überlegt, das IPoAC-Protokoll zu implementieren, um dieses Dilemma zu lösen, uns aber aus technischen Gründen dagegen entschieden. Zu Beginn müssten sie die App irgendwie herunterladen. Aber sobald sie das getan haben, können sie die App offline öffnen und ihre Daten übermitteln. Sogar ihre Fotos. Sobald sie wieder eine Verbindung haben, werden ihre Daten und Fotos im Hintergrund hochgeladen. Aufgrund der Art und Weise, wie ich diese Funktion gebaut habe, können Uploads auch bei sporadischen Internetverbindungen durchgeführt werden, bei denen ein Teil der Datei hochgeladen werden könnte, bevor die Verbindung abbricht. Im Wesentlichen werden fehlgeschlagene Upload-Versuche behandelt.

Wir haben uns entschieden, die von den Benutzern eingegebenen Daten innerhalb der Apps zentral zu speichern, sodass die App-Ersteller jede Eingabe in einer einfachen, leicht zu filternden Tabelle sehen können. Für Unternehmen, die die Eingaben der Endkunden an anderer Stelle benötigen, war dies jedoch nicht ausreichend.

Die Endkunden benötigen die Eingaben, um sie in ihre aktuellen Systeme zu integrieren. Da Excel scheinbar das Rückgrat vieler kleiner und mittlerer Unternehmen ist, habe ich einen Excel-Exporter gebaut. Tatsächlich habe ich mehrere Exporter für verschiedene Formate gebaut, aber da jedes Unternehmen Excel "sprach", war das der Erste, den ich programmiert habe.

Erinnern Sie sich an das oben erwähnte Element "Wiederholungsgruppe"? Mit diesem Element können dieselben Elemente in einer App mehrfach wiederholt werden. Um große Mengen dieser Daten schnell in ein einfaches Excel-Format ohne Pivot-Tabellen zu konvertieren, musste ich mein Wissen über Datenstrukturen und Algorithmen nutzen. Dies machte den Endkunden deutlich, dass wir ihre Zeit zu schätzen wissen. Die Konvertierung dieser Daten war besonders herausfordernd, wenn diese Daten Benutzervariablen enthalten.

Benutzervariablen sind eine Funktion, die es dem Formularersteller ermöglicht, die Eingaben in einem Teil des Formulars (oder beliebige Daten) zu nehmen, sie potenziell umzuwandeln und sie an anderer Stelle im Formular zu verwenden und/oder anzuzeigen. Dies war notwendig, um Kunden die Möglichkeit zu geben, ihre eigene Geschäftslogik in die von ihnen erstellten Anwendungen einzubringen.

Den Kunden zu ermöglichen, flexibel zu bleiben und ihre Apps sofort zu aktualisieren, war ein entscheidendes Problem, das wir gelöst haben. Wir haben nicht nur Funktionen wie Versionierung und Benutzervariablen implementiert, sondern den Kunden auch erlaubt, ihre eigenen Datenquellen mitzubringen. Perfekt für den Fall, dass Sie viele Lagerartikel verwalten und einen aus einer Dropdown-Liste auswählen müssen. EDR hat das für Sie erledigt. Es war eine Menge Programmierarbeit nötig, um diese Funktion mit allen vorherigen Funktionen zum Laufen zu bringen. Dank meiner Verwendung von SOLID-Prinzipien verlief dies reibungslos. Gleichzeitig stellte ich testbarer, wartbarer Code sicher.

Fazit

Um die Bedürfnisse der Kunden von EDR zu lösen, programmierte ich das Front- und Backend eines leistungsstarken App-Builders mit folgenden Funktionen:

  • Drag-and-drop UI
  • Rules Engine
  • Benutzervariablen
  • Datenquellen
  • Excel-Export
  • PDF-Erzeugung
  • E-Mail-Benachrichtigung
  • Datei-Upload, Persistenz und Export
  • Teilbare Links
  • Offline-Funktionalität

Die EDR GmbH war von meiner Arbeit begeistert. Wenn auch Sie wollen, dass ich etwas Tolles liefere, können Sie mich hier kontaktieren.