Quick Start with the Mobile Development Kit (MDK)

This step includes creating the mobile development kit project in the editor.

1. Launch the Dev space in SAP Business Application Studio.

2. If you do not see the Welcome page, navigate to View menu → Find Command → search with Welcome to launch the Welcome page.

   

3. In Welcome page, click New project from template .

   

4. Select MDK Project and click Next.

   

5. In Basic Information step, select or provide the below information and click Next:

   Field	Value
   MDK Template Type	Select CRUD from the dropdown
   Your Project Name	MDKApp
   Your Project Name	<default name is same as Project name, you can provide any name of your choice>

   

   The CRUD template creates the offline or online actions, rules, messages, List Detail Pages with editable options.

   More details on MDK template is available in help documentation.

6. In SAP Cloud Platform Connection step, you will see your Cloud Foundry Organization and Space information. If you are not logged on yet, provide required credentials to retrieve your details. Click Next.

   

7. In Service Configuration step, provide or select the below information and click Next:

   Field	Value
   Service File Name	<You can continue with default name or provide any name of your choice>
   OData Source	Select Mobile Services from the dropdown
   Application Id	Select com.sap.mdk.demo from the dropdown
   Destination	Select com.sap.edm.sampleservice.v2 from the dropdown
   Enable Offline	Choose Yes

   For Offline OData capability only OData V2 is supported. OData V2 and V4 are supported for Online OData.

   

   In this tutorial, server-side configuration for this MDK app were already done.

   Regardless of whether you are creating an online or offline application, this step is needed app to connect to an OData service. When building an Mobile Development Kit application, it assumes the OData service created and the destination that points to this service is setup in Mobile Services.

   Since you will create an offline based app, hence Enable Offline option is selected.

8. In OData Collections step, select Customers, Products, SalesOrderHeaders and SalesOrderItems. Click Next to finish the project creation.

   

9. After clicking Next, the wizard will generate your MDK Application based on your selections. You should now see the MDKApp project in the project explorer. As you have already opened the workspace, there is no need to open the generated project in new workspace or to add it to workspace. Ignore the pop-up or click the cross icon to hide the window.

   

This is how the project structure looks like within the workspace.

These are the metadata definitions available in the editor and the format in which these metadata definitions are stored in the editor. Just to brief on some of these:

• InitializeOffline.action: For offline applications, this action binds the application to the Offline OData server and downloads the required data to the offline store on the mobile device.

• DownloadOffline.action and UploadOffline.action: Using app initialization, data is downloaded to the offline store. If you want to have the application download any updated data from the backend server or upload changed data to the backend server, these actions will be needed.

• Success & Failure Message action: Here are some messages showing up in the app on a successful or failure of data initialization, sync etc.

• Main.page: This is the first page of your Mobile Development Kit application that is shown. For this application you will use this as a launching page to get to application functionality.

• OnWillUpdate.js: MDK applications automatically download updates and apply them to the client without the end-user needing to take any action. The OnWillUpdate rule empowers the user to run business logic before the new definitions are applied. This allows the app designer to include logic to prompt the user to accept or defer applying the new definitions based on their current activity. For example, if the end-user is currently adding new customer details or in the middle of a transaction, they will be able to defer the update. The app will prompt again the next time it checks for updates.

• Application.app: this is the main configuration file for your application from within SAP Business Application Studio. Here you set your start page (here in this tutorial, it is main.page), action settings for different stages of the application session lifecycle, push notifications, and more.

You can find more details about metadata definitions.

Open the application settings in the application editor by double clicking on the Application.app.

So far, you have learned how to build an MDK application in the SAP Business Application Studio editor. Now, we deploy this application definition to Mobile Services.

Right-click Application.app and select MDK: Deploy.

You should see Deploy Succeeded message.

SAP Business Application Studio has a feature to generate QR code for app onboarding.

Double-click the Application.app to open it in MDK Application Editor and click Application QR Code icon to populate the QR code.

Make sure you are choosing the right device platform tab above. Once you have scanned and onboarded using the onboarding URL, it will be remembered. When you Log out and onboard again, you will be asked either to continue to use current application or to scan new QR code.

Follow these steps to on-board the MDK client.

Once you accept app update, you will see the list of entities on the Main page, LOGOUT and SYNC options at bottom of the page and Offline store is being initialized. click either entity, it navigates to detail page, you can create, update, delete a record. This record gets saved to offline request queue database, navigate back to main page and press SYNC to upload local changes to the backend. Once the upload is successful, it will also download the data from the backend to the offline store to have same dataset on both ends.

Follow these steps to on-board the MDK client.

Once you accept app update, you will see the list of entities on the Main page, Logout and Sync options at bottom of the page and Offline store is being initialized. click either entity, it navigates to detail page, you can create, update, delete a record. This record gets saved to offline request queue database, navigate back to main page and press Sync to upload local changes to the backend. Once the upload is successful, it will also download the data from the backend to the offline store to have same dataset on both ends.

Once you have scanned and onboarded using the onboarding URL, it will be remembered. When you Log out and onboard again, you will be asked either to continue to use current application or to scan new QR code.

Congratulations! You have created an MDK app with just couple of clicks. You may now follow these tutorials to create an MDK app from scratch.