XAM uses the same getter and setter logic as MobX but tailored for UI5 development, and it fits perfectly in Expertum's "Cloud Developments & Services" menu as part of the main course "App Development."
Over the past years, our UI developers have encountered a lot of different clients with different types of projects, but they all share one common issue. Most applications are becoming monoliths on their own and it becomes increasingly harder to maintain these in an easy fashion. Guidelines of SAP and such aside, there will always be instances where UI logic is needed.
State management has always been a hot topic in UI development. Specifically, in SAP UI5 development there isn’t really a gold standard for this. With application state management, you can easily maintain knowledge of your app's inputs across multiple related data flows. This means you'll always have a complete understanding of your business transactions or sessions, allowing you to assess your app's condition at any given moment.
As you probably know, inputs are the information that users put into your app. And with state management, you can easily track the condition of your app based on its stored inputs, which are saved as variables or constants. This makes it easier to provide a seamless and intuitive experience for your users.
XAM all starts from a session perspective. Each app has one or maybe even multiple sessions. Each session has its own set of microservice libraries to serve data in a singleton pattern. XAM is built up in JavaScript classes using Object-Oriented software design. Each data object only exists once and is shared globally across the app. It’s therefore not needed to create multiple object types to use in your app.
XAM acts as a middleman between any middleware or backend service and a frontend app. It can be seen as a frontend API, that can call data through any REST endpoint. Furthermore it “flattens” data structures. Even when using the code-pushdown logic to have most of your business logic placed in a backend system, not every data endpoint is able or is designed with that same thought in mind. Sometimes it’s also necessary to have a more broadly available dataset provided by a backend service which is then slimmed down in an app. This is where XAM shines: data structures can be broken up into the tiniest chunks, providing logic on top of any backend data service, while still delivering amazing performance for the front end.
SAP BTP, UI5 with XAM and NodeJS
XAM works even better in combination with our NodeJS middleware layer. Custom apps built on top of SAP Business Technology Platform (BTP) always use a NodeJS middleware. When connecting to SAP and Non-SAP backend systems, this NodeJS middleware acts as a server-side (TypeScript) app that handles authentication, logging, role management and so much more. Over the years Expertum has also perfected this middleware layer.
Expertum has a ready-to-use template that handles a lot of things out of the box. No more setting up boilerplate code for running apps on SAP BTP. Connectivity uses an extended version of the SAP Cloud SDK connector, which SAP uses in the Cloud Application Programming model, to either connect to an SAP backend through an SAP Cloud Connector or to connect to a Non-SAP system through a REST interface. The NodeJS middleware layer is used as part of the “API development” main course in our “Cloud Developments & Services” menu.
This middleware layer also exposes its own endpoints to a connected frontend app via REST endpoints, which can be consumed by XAM. This marriage between a frontend API and a middleware API enables us to create the most seamless apps for our customers.
About the author
Fabian Camps is our Innovation Consultant at Expertum.
Read more articles by Fabian Camps
