Portal Service, Hana Cloud Connector, Fiori Launchpad, and HANA Database – SAP provides a plethora of services. It’s easy to get overwhelmed trying to match a specific system architecture to your needs.
You’re here with Pangaea Solutions because you would like to publish a UI5 app on to your Hana Cloud Platform. You want to provide your users with a mobile responsive and user experience-driven application suite. This system architecture utilizes the Fiori Launchpad in combination with the HANA in-memory Database to drive your specific UI5 application functionality.
We hope that by the end of this post, you and your team will be in a stronger position to make Fiori work for you, while simultaneously avoiding the common pitfalls that can arise when configuring the Launchpad.
GETTING STARTED
Here are the list of products you will need to purchase to make your Fiori Launchpad setup a breeze:
-
A HANA Database, running on the cloud or on premise
-
SAP’s Web IDE for development of your UI5 application
-
SAP Portal Service (Portal service is recommended as it provides the UI structure for configuring the roles, tiles, layout, and color scheme of your Launchpad.)
-
A working index.html file in each your HTML5 apps
-
Separate instances of HANA DB if you’re looking to build a Fiori Launchpad for Development and one for Quality Assurance for example.
STEPS TO TAKE
Your first step in configuring the Fiori Launchpad is to assign yourself the role required to work with the Portal Service. The Portal Service is simply the UI which allows you to configure the Fiori Launchpad to display your built UI5 applications. To assign your user the correct role:
-
Navigate to us1.hana.ondemand.com (or the specified HANA server instance you’re using).
-
Go into the “security” tab.
-
Click “Authorizations.”
-
Type in your user’s S-number (or P-Number if your system is configured with the Identity Provider).
-
Select “Assign Role.”
-
In the popovers you can select the “account”, the “application” and the “role.”
The Role is different for all configurations, but choose these values for the account and role fields.
Account = Portal
Application = nwx
Role = TENANT_ADMIN
Adding permissions to configure the Fiori launchpadWith those two entered and a value for the role selected, your user should now have the necessary permissions for configuring the Fiori Launchpad.
To create your site entry:
-
Go into your services tab and click “Portal.”
-
Click the blue link “Go to Service.” You should be directed to your homepage which shows a couple of graphs and charts.
-
Click “Site Directory” on the left side of the page to navigate to a list of your Launchpad sites (if you have created any).
-
If your site list is empty, simply click the + mark, choose your site alias name, and select the default layout.
You will have the option to create catalogs, tile groups, and tiles. For more information on each of these, please consult the glossary.
Next, you will need to add in a code snippet in the index.html file of your HTML5 applications so that Fiori can reference your app location. To find your HTML5 applications:
-
Go to the root of the Hana Cloud Platform.
-
Navigate to Applications > HTML5 Applications.
-
Using the snippet below, replace the “your ID here” with the id field found in the first few lines of your manifest.json, and paste the whole thing into a section of your index.html.
-
If your site list is empty, simply click the + mark, choose your site alias name, and select the default layout.
</script>
To deploy the app:
-
Navigate back to the folder structure (still in Web IDE) and right click on the main folder.
-
Click “Deploy.”
-
Click “Deploy to SAP Cloud Platform.”
If you click “Register to Fiori Launchpad” instead, there can be issues where a separate app entry is created in the portal service, one which might not have the necessary metadata required to launch correctly from the Launchpad. Additionally, deploying the app in this way can lead to multiple versions appearing in the Fiori Launchpad, when you only intended on having one current version.
-
Go back to the HTML5 app list inside the “Applications > HTML5 Applications” area of HANA Cloud Platform.
-
You will see a list of all the HTML5 apps you’ve created, and a status will display next to each entry. Make sure this reads as “Started”, then click the stop button.
-
Wait a moment, then reactivate the app by clicking the play button. What you have just done is stopped the current running version so that the new version can be started once you press play.
6. Create and configure your Fiori tiles.
When you click on your site, you should be transitioned into a Master-Detail application which allows you to configure your catalogs, groups, and tiles. All that is left to do now is:
-
Go into your app settings.
-
Create the actual application entry.
-
Change the tile name, catalog, and group to suit your purpose.
-
If you’ve done everything up to this point correctly, you should see a list of your HTML5 apps that have been created. Choose one and continue.
If you would like to know how to set up catalogs, tile groups, and add role based permissions to your Fiori apps, check out our article “Everything You Need to Know About Role-Based Security in Fiori” (coming soon).
7. Publish your site.
Now that your apps are all named and assigned to catalogs and groups, your last step is to “Publish” your site. Every time you make changes to your tiles in the Fiori Launchpad, these changes will not be made live on your site until the whole thing is published.
Go to the top right hand corner of the screen and click the publish button. After this is done, you will have the option to go to your Launchpad. Do this and take note of the html link!
Anyone in your organization with the proper front end permissions, catalog access, and back-end permissions will be able to view this page and interact with your applications. Again, if you would like to know more about these permissions, feel free to check out our article “Everything you need to know about role based security in Fiori” (Coming Soon)
YOU’RE DONE!
There you have it – a complete guide to setting up your instance of SAP Fiori with the default catalog permissions and tile groups. Do you have any tips on how to navigate the world of Fiori? If so, please leave us a comment or get in touch with us directly!
Stayed tuned for our next post on Plant Maintenance.
Thomas Rautenbach, Architect
Thomas Rautenbach has over 20 years of diverse systems experience with a strong focus on system and integration architecture and software design and development. He has detailed technical, functional and system knowledge across the SAP technology platform, including extensive experience with the Finance, Supply Chain, Sales and Distribution, and Human Resources modules.
Follow Pangaea Solutions on LinkedIn
Resources
Configuring Site Settings Guide
Building SAPUI5 Applications on SAP NetWeaver AS ABAP 7.31 Consuming Gateway Data Services
GLOSSARY
| Site | The html webpage which displays your configured Fiori Launchpad |
| Portal Service | The User Interface provided by SAP to allow simple modular configuration of your Fiori Launchpad instance |
| Catalog Group | One or many apps related to a user group, which can be dynamically hid or shown based on permissions |
| Tile Group | A logical grouping of apps which stick together in the interface of the Fiori Launchpad |
| Tile | A square shaped link to your UI5 application, shown on the Fiori Launchpad. Multiple tiles can be created for a single application, but only once per version |
