Build Apps Integration with On-premise systems

[SijinMathewGeorge]

The data plays a critical role in the functionality of the app.

Data can be integrated to the Build Apps in the following ways:

1. Creating Dummy Entities with dummy data or on device storage data.
2. Creating Entities with the global REST APIs.
3. Integrating Build Apps with on-premise and fetching the on-premise entities.

We would focus on the most realistic option that is fetching the real-time system data and integration of Build Apps with the OData services created on the on-premise systems.

Design:

We would like to display a simple example where the App would list of products with their respective image, description and MRP maintained in SAP.

The backend OData service would contain an entity ProductsSet that would contain properties of a material like Image, description and MRP.

Integration:

Till now, it has been widely accepted that Build Apps can be accessed from SAP BTP Account. BTP Account must have a cloud connector which would configure the systems connected to the cloud.

In the subaccount, under connectivity, Destinations are configured.

The entire OData URL has been configured as shown below under destination BuildDestination.

Once the destination is configured, we can navigate to the SAP Build Apps.

Under the Auth section, enable the Authentication.

Open Auth (Authentication) → Enable Authentication.

There are three types of Authentication Method in Build Apps.

• Google Firebase.
• SAP BTP Authentication
• Direct Third Party Authentication

We would go for SAP BTP Authentication.

As we need to select the data from the backend, Under the Data tab, select add Integration.

Select Data → Add Integration.

Select SAP Systems->BTP Destinations

The created destination will be showed there, select the Destination.

Once the destination is selected, the list of entities from the Rest service would be displayed.

Click on Install Integration and enable data entity.

Switch to the UI Canvas. Under Data variables, we can create Entities as a variable. Select the entityset that is a collection of records and save.

Switch to the view in the UI Canvas and the UI element used here is Large Image List Item which is which is available in Market Place.

The Repeat with property of the List Container can be bound with the data variables we had set previously.

Select the entityset and save.

The properties, label can be bound to the Maktx of the entityset.

Similarly, price can be bound to the property Description text.

As we need to display the image too, the image can be bound using the formula URL(repeated.current.ImageContent).

Once the binding is completed, The Image, Description and Price of the products could be shown on the screen.

Hurray! A real time Build App with the secure connection to backend is ready!