Technik & Architektur

Technologie & Architektur - Frontend

Als technische Basis für Fiori dient SAPUI5 (SAP User Interface 5). Hierbei handelt es sich um ein von OpenUI5 abgeleitetes Framework, bestehend aus HTML5, JavaScript, XML sowie CSS. SAPUI5 eignet sich für die Erstellung von Webanwendungen im SAP- und non-SAP-Umfeld. Dabei werden bei solchen Webanwendungen die Oberfläche und die Datenbasis klar voneinander getrennt.

Ein besonderes Merkmal ist die plattformübergreifende Kompatibilität von SAPUI5, da es sich um eine browserbasierte Technologie handelt. Somit können nicht nur Anwendungen für Desktops, sondern auch responsive Anwendungen für Smartphones oder Tablets erstellt werden. Durch verschiedene Bibliotheken ist es außerdem möglich auf verschiedene Geräte-Funktionen zuzugreifen. Somit kann bspw. die Kamera zum Scannen eines Barcodes angesteuert werden.

Es ist möglich, mit Hilfe von OData-Services Daten aus CDS-Views (Core Data Services) oder ABAP-Programmen bereitzustellen und diese in einer Anwendung zu nutzen und weiterzuverarbeiten. Daten aus dem Backend können auch mit weiteren Technologien wie bspw. PHP an das UI5-Frontend übermittelt werden. Unter bestimmten Voraussetzungen können Fiori Anwendungen auch offline genutzt werden.

Um ein einheitliches und SAP-konformes Design zu gewährleisten, stellt SAPUI5 verschiedene Bibliotheken zur Erstellung und Gestaltung von Anwendungen bereit. Ergänzend gibt es die SAP Fiori Design Guidelines zur Unterstützung bei der Suche nach den passenden Elementen, wie bspw. Tabellen oder Listen, Buttons, Textfelder oder gar ganzen App Templates.

Technologie & Architektur - Backend

OData steht für Open Data Protocol. Hierbei handelt es sich um ein Datenzugriffsprotokoll, welches im Jahr 2007 von Microsoft herausgegeben wurde. Ein OData-Service ermöglicht die Datenextraktion aus dem SAP Backend System über den SAP Gateway. Für die Übertragung der Daten nutzt OData HTTP (Hyper Text Transfer Protocol). Die Modellierung der Daten erfolgt mit JSON oder XML. Die Haupt-Bestandteile einer OData-Implementierung sind das Datenmodell, das Protokoll und die Services. Der eigentliche OData-Service ist hierbei die Implementierung eines OData-Protokolls, welcher wiederrum aus dem Servicedokument und dem Servicemetadatendokument besteht.

Neben einem S/4HANA-System, kann ein Backend auch ECC-, CAR- oder BW-System sein. Grundsätzlich kann OData auch losgelöst von SAP genutzt werden. Systeme werden Front- und Backend aufgeteilt, um die Benutzeroberfläche, sowie die Datenverwaltung und die Datenbanktabellen getrennt voneinander verwalten zu können.

Der Aufruf erfolgt über URI (Uniform Resource Identifiers), die bestimmen welcher OData-Service mit welchem Datenmodell aufgerufen wird. Gemäß den REST-Richtlinien ist der Aufruf des OData-Service durch folgende Requests zulässig:

  • GET: Ermitteln eines einzelnen Eintrags oder einer Liste von Einträgen
  • POST: Erzeugen eines neuen Eintrags
  • PUT: Verändern eines existierenden Eintrags
  • DELETE: Löschen eines existierenden Eintrags
  • PATCH: Aktualisieren einzelner Attribute eines existierenden Eintrags

Entwicklungsumgebung SAP WebIDE

Die SAP Web IDE ist eine browser-basierte Entwicklungsumgebung, welche für die Frontend-Entwicklung von SAP Fiori Apps sowie SAPUI5 und openUI5 Anwendungen genutzt werden kann. Sie kann lokal oder in der Cloud installiert werden. Neben vorgefertigten Templates (Vorlagen) für bestimmte Fiori Apps wie bspw. eine Master Detail Application oder eine List Report Application gibt es auch den Layout Editor zum Erstellen von eigenen Designs. Die grafischen Elemente verankern bereits die SAP Fiori Design Guidelines, sodass der Entwickler erkennt, wenn er ein Element bspw. an einer nicht vorgesehenen Stelle einfügen möchte. Ferner gibt es die Möglichkeit verschiedene Bildschirmformate (Smartphone, Tablet, Desktop) zu simulieren.

Darüber hinaus lässt sich beim Erstellen einer App aus einer Vorlage auch eine im Backend definierte Datenquelle einfach einbinden. Das Testen einer entwickelten Anwendung kann in mehreren Modi geschehen, wie bspw. über die Component.js bzw. index.html oder in einer SAP Fiori Launchpad Sandbox. Im letzteren kann bspw. die Navigation von und zu einem Launchpad getestet werden. Zu guter Letzt kann eine fertige Anwendung von der Web IDE in ein SAPUI5 ABAP Repository oder in die Cloud deployed werden. Eine Anbindung an Git ist ebenfalls möglich.

Für die Erstellung von IoT-Apps (Internet of Things) kann das SAP IoT Application Enablement Toolkit genutzt werden.

Entwicklungsumgebung Eclipse

Eclipse ist eine im Jahr 2001 eingeführte open source Entwicklungsumgebung, welche zunächst nur für Java-Entwicklungen genutzt wurde. Aufgrund der guten Erweiterbarkeit dieser IDE, können heutzutage eine Vielzahl von Programmiersprachen verarbeitet werden. Somit ist es seit geraumer Zeit möglich, ABAP Programme und CDS-Views in Eclipse zu erstellen, zu bearbeiten und auszuführen. Die IDE (Integrated Development Environment) kann hierzu an ein SAP-System angebunden werden, sodass der Anwender Zugriff auf die Entwicklungsobjekte und Transportaufträge bekommt. Damit dies möglich ist, müssen die SAP Development Tools als Plugin installiert werden.

Nähere Informationen zur Installation und Versionshinweise finden sich hier: SAP Development Tools (ondemand.com)

Entwicklungsumgebung SAP Business Application Studio

Das SAP Business Application Studio (BAS) ist der Nachfolger der Web IDE und wurde im Februar 2020 veröffentlicht. Die Web IDE wird jedoch parallel als Entwicklungsumgebung unterstützt. Das BAS ist eine IDE, welche als Cloudservice angeboten wird. Enthalten sind eine Kommandozeilen-Konsole, integriertes Debugging und ein optimierter Code-Editor. Weitere Tools, die auf bestimmte Geschäftsszenarien zugeschnitten sind, werden in sogenannten Dev Spaces zusammengefasst. Sie enthalten zudem vorinstallierte Laufzeitumgebungen zum Testen von S/4 HANA Erweiterungen und SAP Fiori Apps. Erweiterungen und Fiori Anwendungen stellen den Hauptfokus dieser IDE dar. Für mobile Anwendungen gibt es zusätzlich noch das Mobile Development Kit.

(Quelle der Abb.: https://www.sapstore.com/solutions/45318/SAP-Business-Application-Studio---the-evolution-of-SAP-Web-IDE)