Shopbetreiber-Dashboard auf Basis von GraphQL
Die Dashboard Idee erreichte Platz 3 bei den OXID API Coding Days
Interview mit Thorsten Schneider, Y-SQUARE
1. Thorsten, du hast bei den OXID Coding Days ein Team angeführt. Wie lautete der Titel eures Projekts und kannst du es kurz beschreiben?
Die Coding Days haben uns mal wieder den perfekten Rahmen gegeben, um an ein Thema heranzugehen, dass uns immer wieder beschäftigt: Ein Dashboard für den Shopbetreiber um übersichtlich die wichtigsten Kennzahlen seines Shops einsehen zu können, ohne diese quer durch den Shop zusammensuchen zu müssen. Dabei herausgekommen ist das Shopbetreiber Dashboard auf Basis von GraphQL.
2. Wie seid ihr auf die Idee gekommen?
Wir haben im täglichen Agenturgeschäft oft die Frage von Kunden, wie sie einen Überblick über die wirtschaftliche Performance des eigenen Onlineshops bekommen können. Bisher war dies oft nur als Erweiterung im OXID Backend möglich. Mit der Ankündigung auf den Coding Days den Fokus auf GraphQL zu setzen war der Sprung zu dieser Dashboard Idee daher nicht mehr weit.
3. Wie hat sich euer Team zusammengesetzt?
Das Team hat sich schnell gefunden und war gut durchmischt mit allen Fähigkeiten, die wir für die Umsetzung benötigt haben und mit ausreichend Erfahrung auf jedem Gebiet um schnell starten zu können.
4. Welches Problem kann man mit der Idee lösen?
Unser Dashboard ist in der Lage über GraphQL Daten aus dem OXID Shop zu akkumulieren und in aufbereiteter Form einem Shopbetreiber zu präsentieren. So kann der Shopbetreiber schnell sehen, wie sich sein Shop entwickelt, welche Stellschrauben er noch drehen kann und welche Anpassungen welche Veränderungen verursachen. Von Umsatzentwicklung über Artikelbestand bis hin zur Identifikation von Ladenhütern kann man sich hier schnell einen Überblick verschaffen.
5. Was waren die Herausforderungen beim Umsetzen?
Das Team hatte insgesamt zwar sehr viel Erfahrung mit OXID aber noch wenig mit GraphQL und im speziellen mit der Implementierung die OXID gewählt hat. Wie bei allen neuen Technologien war auch hier die größte Herausforderung, das Thema zu meistern und die ersten Schritte zu machen. Somit waren dann auch tatsächlich die allerersten Schritte, die erste erfolgreiche Kommunikation mit der OXID Schnittstelle, die größten Herausforderungen.
6. Wie seid ihr herangegangen?
Wir haben uns nach einem kurzen Kennenlernen in zwei Gruppen gesplittet. Die erste Gruppe hat sich zunächst darum gekümmert zu klären, welche Daten bereits aus der Standard-Implementierung abgerufen werden können. Danach ging es daran die GraphQL-Schnittstelle zu erweitern, um die weiteren Informationen aus der Shop-Datenbank zu extrahieren. Die zweite Gruppe hat sich darum gekümmert über eine Frontend-Technologie (in unserem Fall React) den optisch-funktionalen Teil im Browser zu bauen, der die Schnittstelle zur Datenaggregation nutzt und dem Benutzer als Graphen- und Kennzahl-Widgets anzeigt.
7. Was hat besonders Spaß gemacht und was ist besonders an dem Projekt?
Ein neues Projekt mit neuer Technologie in zwei Tagen umzusetzen ist ein straffes Programm. Da müssen alle an einem Strang ziehen und das war hier der Fall. Der positiv-produktive menschliche Austausch und die großen Entwicklungsschritte nach überspringen der ersten „Lernhürde“ muss man hier ganz klar herausstellen. Das dies alles auch in diesem virtuellen Format möglich ist, in dem man nicht eben mal mit Papier und Bleistift Face-to-Face ein Problem besprechen kann, das hätte ich anfangs nicht gedacht. Am Ende einen auf allen Ebenen funktionalen Prototypen präsentieren zu können, war die Kirsche auf dem Sahnestück.
8. Wie sieht die Lösung konkret aus?
Die Lösung besteht aktuell aus zwei Teilen. Der eine Teil ist ein klassisches OXID Modul, das auf der Shop-Seite die GraphQL-Schnittstelle erweitert. In der ersten Ausbaustufe wurden hier prototypisch Informationen aus Bestellungen aggregiert. Dabei wurde in der Entwicklung darauf geachtet, dass das Modul erweiterbar ist, um zukünftig zusätzliche Kennzahlen und Informationen einfach hinzufügen zu können.
Der zweite Teil ist eine React-App, die unabhängig vom Shop installiert werden kann. Entweder neben dem Shop auf dem gleichen Server oder aber zum Beispiel im Intranet, um den Zugriff aus dem Internet zu beschränken. Die Kommunikation findet dann verschlüsselt über die GraphQL-Schnittstelle statt und ist mit einem Passwort gesichert. Hierbei haben wir darauf gesetzt, die vorhandenen, erprobten Technologien zu nutzen. Auch hier haben wir auf Erweiterbarkeit gesetzt, so dass es einfach möglich sein wird, neue Kennzahlen einzubinden und anzuzeigen.
9. Wie kann man die Lösung in der Praxis einsetzen und was wäre sonst noch damit denkbar?
Der aktuellen Stand kann nur wenige Kennzahlen anzeigen. Es ging uns zunächst um einen Proof-of-Concept, den wir hier zu einem erfolgreichen Abschluss gebracht haben. Dennoch kann man sagen, dass man aus den wenigen Kennzahlen als Shopbetreiber schon jetzt die ersten Schlüsse ziehen und daraus Business-Entscheidungen treffen kann.
Neben der Erweiterung auf OXID Seite, um weitere Kennzahlen aus dem Shop bereitzustellen, können wir uns vorstellen, dass man in der React-App auch weitere Quellen über GraphQL anzapfen könnte wie z.B. ERP-, Payment-, Catalogue- oder Fulfilment-Systeme, um die Daten in Relation zu setzen und so auch generelle und systemübergreifende Entscheidungen treffen zu können, die die Prozesse verbessern.
