Ein Gastbeitrag von Hanna Chen
In Zukunft müssen sich die Utopien beeilen, wenn sie nicht von der Realität eingeholt werden wollen.
Wernher von Braun
Das Rad der technologischen Entwicklung dreht sich stetig, wie es schon Wernher von Braun erklärte. Und so auch das Shopify-Ökosystem.
Eingebettete Apps sind ein wichtiger Teil dieser Symbiose, denn sie ermöglichen es Händlern, ihren Shops Funktionalität hinzuzufügen, ohne die gewohnte Umgebung des Adminbereichs zu verlassen. Als Entwickler von Shopify Apps hast du vielleicht bereits die Möglichkeit der Entwicklung solcher eingebetteter Apps erkannt, um Händlern zusätzliche Optionen für den Ausbau ihres Business zu bieten.
Im Laufe der Zeit haben sich eingebettete Apps von einem kleinen Experiment gemausert und sind nun leistungsfähiger, als wir es uns je hätten vorstellen können. Ursprünglich verwendete Shopify Tools wie das Embedded App Software Development Kit (EASDK) und das Point of Sale Software Development Kit (POSSDK), um eingebettete Apps zu erstellen. Mit dem Wachstum unseres App-Ökosystems konnten diese Tools jedoch nicht mehr mit den Bedürfnissen der Entwickler Schritt halten.
Aus diesem Grund haben wir im Rahmen der Shopify Unite 2019 ein einheitliches Tool für die Entwicklung eingebetteter Apps auf allen Shopify-Plattformen eingeführt – die Shopify App Bridge.
Die App Bridge ermöglicht es dir, deine App überall dort einzubetten, wo Händler mit ihrem Adminbereich interagieren. Ein zentrales Frontend, das mit ihr geschrieben wurde, kann POS-, Desktop- und Mobil-Apps unterstützen. Außerdem sind Apps, die mit der Shopify App Bridge erstellt wurden, leistungsfähiger und flexibler und können Hardware in einer Weise nutzen, wie es keine andere Shopify App kann. In diesem Artikel schauen wir uns die Möglichkeiten an, die Entwickler mit der App Bridge nutzen können.
Leistung und Flexibilität: Alles in einer Bibliothek
In einer Welt vor Shopify App Bridge mussten Apps, die sowohl auf Shopify POS als auch im Adminbereich eingesetzt werden sollten, zwei separate client-side libraries verwenden: eine für Shopify POS und eine zum Einbetten in den Web-Adminbereich. Die App Bridge reduziert diese Anforderung auf eine einzige Bibliothek und ermöglicht so eine einheitlichere Händlererfahrung und eine stark optimierte Entwicklung.
Dadurch wird nicht nur die Einheitlichkeit und Entwicklungseffizienz verbessert, sondern Apps laden zudem bis zu viermal schneller jene Applikationen, die mit dem EASDK oder POSSDK erstellt wurden.
Lesetipp: Der Wer zur eigenen Shopify App: Ein Investmentbanker wird zum erfolgreichen App-Entwickler.
Aktionen und Aktionsgruppen: Arbeitserleichterung durch Gruppierungen
Aktionen sind eine neue Möglichkeit für Apps, die App Bridge zu nutzen, um mit Shopify zu interagieren. Durch die Verwendung von Aktionen erhältst du die Kontrolle über viele der User-Interface-Elemente von Shopify. In der oberen Leiste sind die Ladeanzeige, die modals, die Ressourcenauswahl und die Schaltflächen zu sehen. Diese sind verfügbar, damit sich deine App wie eine native Shopify-Erfahrung anfühlt. Aktionen lassen sich dadurch leicht ausführen, um Befehle in einem bestimmten Kontext durchzuführen, zum Beispiel das Anzeigen einer Nachricht oder das Bereitstellen einer kontextbezogenen Speicherleiste.
Lesetipp: Wie du eine einzigartige Über-uns-Seite gestaltest, verraten wir dir in diesem Beitrag.
Die wahre Leistung von Aktionen zeigt sich jedoch erst, wenn sie zu Aktionsgruppen zusammengefasst (gruppiert) werden. Dadurch kannst du sie jederzeit ausliefern oder abonnieren. Wenn du eine Aktionsgruppe erstellst, wird deren Konfiguration beibehalten und von Shopify und deiner App gemeinsam genutzt. Beide Seiten kennen den Zustand jeder Aktionsgruppe: ob beispielsweise ein Modal offen ist, welches sich in der Titelleiste befindet usw.
Alle Aktionsgruppen verwenden dieselbe Schnittstelle, um die API einfach und einheitlich zu halten: create (Erstellen), set (Festlegen), subscribe (Abonnieren) und dispatch (Versenden).
-
Create: Wird verwendet, um eine Aktionsgruppe zu initialisieren, manchmal mit verschiedenen Optionen. -
Set: Ermöglicht es dir, wenn verfügbar, die Konfiguration einer Aktionsgruppe zu aktualisieren. Zum Beispiel die des Titels in der Titelleiste. -
Subscribe: Benachrichtigt dich über Ereignisse in der UI (User Interface) von Shopify, beispielsweise wenn ein Modal geschlossen wird. -
Dispatch: Sendet Aktionen an Shopify, um die Funktionalität zu aktivieren.
Abgesehen von einigen wenigen Ausnahmen wird beim Erstellen eines Aktionssatzes lediglich die Konfiguration innerhalb des gemeinsam genutzten Zustands gespeichert, was allein nicht viel bewirkt. Aktionsgruppen hingegen bereiten Aktionen vor, die du ausführen kannst.
Aktionsarten: Kommunikation zwischen deiner App und Shopify
Aktionsarten sind statisch definierte Aktionen, die für Aktionsgruppen verfügbar sind. Dies sind die individuellen Nachrichten, die zwischen deiner App und Shopify ausgetauscht werden, um Aufgaben auszuführen und dich über Ereignisse zu informieren.
Am Beispiel der Hinweisnachricht (Toast Message) lautet die Aktionsgruppe Toast, und die für die Toast-Aktionsgruppe verfügbaren Aktionen sind SHOW und CLEAR. In ähnlicher Weise lauten die Aktionsgruppen für Loading START und STOP. Dies sind nur zwei der Aktionsgruppen, die in der Shopify App Bridge verfügbar sind. Wenn sie weiter wächst, werden wir in der Lage sein, noch mehr Aktionstypen hinzuzufügen, um neue Funktionen zu ermöglichen.
Sobald du eine Aktionsgruppe erstellt hast, kannst du die darin enthaltenen Aktionen ausführen oder du abonnierst die von Shopify bereitgestellten Vorlagen. Wenn ein Händler beispielsweise ein Modal aus dem Shopify-Adminbereich schließt, sendet Shopify eine CLOSE-Aktion, die deine App abonnieren kann. Dadurch kann deine App einen Rückruf ermöglichen, der ausgeführt wird, sobald die Aktion versendet wird.
Durch die Kombination einer einfachen, einheitlichen API – create, set, dispatch und subscribe – mit statisch definierten Aktionen bietet die App Bridge dir eine umfassende Kontrolle mit minimalem kognitivem Aufwand. Dies macht sie erweiterbar. Der Einsatz von Aktionen verlagert sich weg von Methoden, die an ein bestimmtes visuelles Design gebunden sind. Stattdessen stellt es dir zusammensetzbare Bausteine zur Verfügung, die nach ihrer Funktionalität gruppiert sind.
Aktionsgruppen behalten ihren Zustand transparent bei, sodass du den aktuellen Zustand deiner Applikation mit Tools wie Redux DevTools überprüfen und sogar vergangene Aktionen zur Fehlersuche wiedergeben kannst.
Lesetipp: Ein Blick hinter die Kulissen: so funktioniert die Technik von Shopify.
Hardware - Eine Verbindung zwischen App und Gerät
Shopify App Bridge bietet die Möglichkeit, über die Aktion Scanner auf leistungsstarke Geräte-Hardwarefunktionen zuzugreifen, einschließlich der Kamera und des NFC-Lesegeräts. Apps können mithilfe der Funktionserkennung feststellen, auf welcher Art von Gerät sie genutzt werden, und dann Zugriff auf die Hardware von Mobilgeräten anfordern (sofern verfügbar). Sobald der Zugriff gewährt wird, übermittelt die Funktionserkennung eine Aktion, um der Anwendung mitzuteilen, dass die Hardware verfügbar ist und das Scannen beginnen kann.
Change Management - Stabilität und Entwicklung Hand in Hand
Die technologische Entwicklung hat ein rasantes Tempo und es ist eine Herausforderung, mit den ständigen Veränderungen Schritt zu halten. Shopify App Bridge schafft ein Gleichgewicht zwischen Stabilität und schneller Bereitstellung neuer Funktionen, indem es eine strenge Versionierung der SemVer-Bibliothek verwendet. Dies ermöglicht es dir die volle Kontrolle über deinen Einführungszyklus.
Ein einheitliches Tool für die Entwicklung eingebetteter Apps
Shopify App Bridge hilft dir dabei, eingebettete Apps schneller zu entwickeln. Dadurch werden neue Möglichkeiten geschaffen, besser integrierte, funktionale Produkte für Händler zu entwickeln. Erleichtere den Alltag deiner Kunden und nutze diese Möglichkeiten noch heute.
Dieser Beitrag von Hanna Chen erschien zuerst auf Englisch und wurde übersetzt.
