How to create first MTA project SAP Cloud Foundry

In this tutorial we will explain how to create your first MTA project in SAP Cloud Foundry environment.

Open the SAP Web IDE for SAP HANA: 

• Access the SAP Cloud Platform Cockpit at https:// account.hanatrial.ondemand.com/cockpit.
• Enter your SAP Cloud Platform e-mail and password. 
• Launch SAP Web IDE from the subscriptions.
• You can also bookmark or save the Web IDE link for future reference.

Once web IDE is launched, Right-click on the workspace folder and choose New then click on Project from Template. 

• It will Pop up the Template Selection screen, select environment as Cloud Foundry.

• Select the Multi-Target Application Project from template selection and press "Next" button.

• Enter the Project Name and press "Next" button.

• It will by default mention the Application Version as 0.0.1, enter the MTA project description and click on the check box to "Use HTML5 Application Repository". 
• This is required because the SAP Fiori launchpad solution stores static resources in the HTML5 repository. Press Next and then click on finish to create the MTA project.

• In the MTA project folder open the "mta.yaml" file and check the content. It will open up the mta.yaml in MTA editor which can help you to see the content in the UI layout interface. We can also click on the Code Editor to review the content in the form of code editor.

How to create and set up SAP Cloud Foundry trial account

 In this tutorial we will learn how to create and set up SAP Cloud Foundry trial account.

• In the browser window open the URL SAP cloud platform and click on "Start Free Trial"

• A pop will appear with Cloud Foundry details scroll to the bottom and choose "Register For Free"

• Follow the given instructions and create the new trial account, once your account is created you will be able to access the SAP Cloud Platform Cockpit at HANA account cockpit

• To Create a trial account, choose the trial account home page and Enter your trial account.

• Set up process for trial account will continue and Region, Global Account, Subaccount, Org, Space will be assigned.

Happy Learning. Thank You for reading, please share and subscribe :) 

Set Up SAP Web IDE for SAP HANA and Node.js artifacts

In this tutorial we will learn how to set up SAP Web IDE for SAP HANA and Node.js artifacts. Follow below mentioned steps to configure the SAP Web IDE -

• Click on settings icon in the left hand side menu panel in Web IDE.
• Go to workspace preferences and choose Extensions. 

• Search for Tools for SAP HANA Database Development, turn the switch to On.

• Search for Tools for Node.js Development, turn the switch to On.

• Search for SAP HANA Database Explorer, turn the switch to On.

• Choose Save to configure the changes. It will automatically refreshes the SAP Web IDE window to changes to reflect.

Happy Learning. Thank You for reading, please share and subscribe :) 

SAP FIORI Launchpad Customization : Custom Logo and Background image

In this tutorial we will learn how to customize FIORI Launchpad login page. We can add custom and user defined background image and logo through custom ABAP class. 

In order to upload the custom image to SAP system and replace the default logon page SAP image follow the below mentioned steps. 

• Go to transaction SE80.
• Click on MIME repository.
• Navigate to image using path - Sap > public > bc > ui2 > logon > image. 
• Right click on Image folder and click on “Import MIME objects”
• Import the image that you want to put as logo in the Launchpad login page.

Imported images will be added to the images node. 

Once images are uploaded create a custom class "ZCL_SRA_LOGIN" which is copy of standard class /UI2/CL_SRA_LOGIN. 

Inside method INIT_DEFAULT_PROPERTIES make changes in the code and below mentioned properties "img_background", "img_background_mobile" and "img_background_mobile_land" so that it points to images we have uploaded in the mime repository. 

set_property( iv_name = 'img_background' iv_value = '/sap/public/bc/ui2/logon/img/custom_login.jpg').

set_property( iv_name = 'img_background_mobile' iv_value = '/sap/public/bc/ui2/logon/img/custom_login_mobile.jpg').

set_property( iv_name = 'img_background_mobile_land' iv_value = '/sap/public/bc/ui2/logon/img/custom_logo.jpg').

• Now go to SICF transaction and navigate to default_host > sap > bc > ui5_ui5 > ui2 > ushell
• Under Error Pages tab click on Configuration Button at the bottom of the screen and change the ABAP class to ZCL_SRA_LOGIN and maintain the client as well. After making the changes, close the pop up by clicking on the tick icon and save the changes by clicking on save button.

Similarly Go to SICF transaction. Follow the path as mentioned below: 

default_host > sap > bc > flp. 

• Under Error Pages tab choose the System logon radio button instead of the default Explicit Response Time Radio button. 
• Click on configuration button and make the following changes in the pop up. Maintain the Z class name "ZCL_SRA_LOGIN" here as well.

We can see the custom logo at the bottom coming through custom class.

Folder Structure SAP UI5 application

Folder structure for SAP UI5 application should contain index.html, manifest.json and Component.js file in the root folder.