Laborheft-App

Die Laborheft-App ist die Idee eines unserer Kunden, die wir fürs CodeCamp aufgegriffen haben. Ole und ich arbeiteten zusammen an der Laborheft-App, die wir als Cross-Plattform-Lösung für iOS und Android umsetzen wollten. Hierfür versuchten wir uns an dem für uns neuen Framework React Native.

Worum geht es? Experimente sollen mithilfe einer App dokumentiert werden können. Ein Versuchsleiter legt die Experimente an und wertet sie nach Abschluss aus.

Im Laufe des CodeCamps sollte ein REST-basiertes Backend entwickelt werden, welches dazu in der Lage ist, verschiedene Experimente auszuliefern sowie die ersten Datentypen der Dokumentation aufzunehmen. Das Backend sollte dabei mindestens in der Lage sein, Text sowie Bilder entgegenzunehmen, zu verarbeiten und auszuliefern. Weiterhin sollte es mittels der Anwendung möglich sein, die Experiment-Dokumentation anzulegen. Diesbezüglich sollten zunächst die Eingabe von Text sowie das Aufnehmen und Anlegen von Bildern realisiert werden. Alle anderen Formen der Dokumentationen wie Audioeingabe, Videodokumentation und das Anlegen von Zeichnungen sollten optional im CodeCamp umgesetzt werden. Spezielle Funktionen für Versuchsleiter zum Anlegen sowie Auswerten von Experimenten wurden bewusst weggelassen.

Die Designs der Laborheft-App von Roland Langmaack

Während des CodeCamps haben wir einen Prototyp entwickelt, der alle Grundfunktionen unterstützt. Die App kann eine Aufgabenliste vom Backend laden und diese anzeigen. Von dort gelangt der Benutzer in die jeweilige Aufgaben-Detailview, in der eine Aufgabenbeschreibung und die bisherigen Notizen eingesehen werden können. Innerhalb der Detailview können dann neue Text- oder Bildnotizen angelegt werden; weitere Notiztypen (Audio, Video, Zeichnen und Dateianhang) sind skizziert. Für die Bildnotizen wird bereits das native Kameramodul des Smartphones oder Tablets angesprochen. Damit wurde das wichtige Ziel erreicht, per JavaScript nativ eine Hardwarekomponente zu nutzen. Auch das Designkonzept wurde in weiten Teilen umgesetzt.

Ole und Marc beim Entwickeln der Laborheft-App

Im Ergebnis lässt sich sagen, dass das Programmieren mit dem Framework React Native und die Kombination mit den bekannten Technologien JavaScript und HTML wirklich spannend war. Interessant war auch der Ansatz, bestehende CSS-Eigenschaften weitgehend zu übernehmen, aber diese über JavaScript-Objekte, also mit voller Code-Unterstützung, an die View zu übergeben. Am Schluss hätten wir gerne noch einen Tag mehr Zeit gehabt, um das Design vollständig umzusetzen und die letzten Ecken und Kanten des Prototyps abzurunden. Auf technischer Ebene sollte erwähnt werden, dass JavaScript trotz der neuen ES6-Features noch nicht die Sprache der Wahl ist, solange es andere Sprachen mit mächtigen Typsystemen gibt.