RaspberryPi on SAP HCP – IoT blog series part 4: Create an SAPUI5 dashboard
Table of Contents
In the third blog post of this blog post series around Raspberry Pi and the SAP HANA Cloud Platform we’ve provided our Raspberry Pi with a Java app that can retrieve the data from the external sensor and send it to the Java app on the SAP HANA Cloud Platform we’ve setup in the second blog post of this series.
In this blog post we’ll take care of the missing piece of our application: the user interface for the dashboard. We’ll create a dashboard that can be used to monitor and keep track of the temperature sensors.
Setup the app as an HTML5 app
In a first step we need to create an HTML5 app in your SAP HANA Cloud Platform account. That’s pretty straight forward and for those of you who are used to work with Git this will be a piece of cake.
Initialize your Git settings (for first-time-HTML5-app users)
In case you are creating an HTML5 app on the SAP HANA Cloud Platform you have to provide Git with some metadata first.
If you’ve already used the HTML5 apps on SAP HANA Cloud Platform you can jump to the next chapter around the creation of an HTML5 app in your account.
If you haven’t done that, yet, this is what you need to do:
Create the app in your account
We need to create the app first on our account so that we get a Git repository for the app. Follow these steps:
1. Open your cockpit for your trial account on SAP HANA Cloud Platform via the link https://account.hanatrial.ondemand.com/cockpit and switch to the HTML5 Applications navigation tab
2. Click first on the button New Application… , enter the application name fishdashboard and click on the Create button.
|3. Click on the name of the newly created app|
|4. Click on the tab Development and copy the link of the Git repository to your clipboard|
Copy the code into your app
With this last step you already have the code of your app in your HTML5 app on your SAP HANA Cloud Platform account. There are now only a few steps missing to have everything up-and-running.
Setup the destination
But the link you’ve clicked on is only accessible to you as the developer of the application. If you want to make it accessible to others we need to version our commit and activate the version.
Create your first version
What you need to do next is to go back to your HTML5 app in the cockpit. At the very right of your commit you’ll find an icon in the column Create Version. Click on that icon, provide a name like 1.0 and click on Add.
Start the dashboard
The last thing you need to do now is to switch to the tab Version Management and click on the symbol in the Activate column for the version you’ve created in the previous step. A popup will show-up and after confirming with clicking on Yes that you want to start the application you can access the app by clicking on the link under Application URL.
Now you can share that link with others and even try out how the app looks like on your smartphone or other devices.
Click on one of the tiles of the app and if you have followed the steps of the first, second and third blog post you can see the chart showing you the last 10 stored temperature values of a sensor that you’ve connected to the RaspberryPi.
What comes next?
We have now our app up-and-running. In the next blog posts will tweak a bit here and there and we’ll look into other aspects of IoT around the SAP HANA Cloud Platform. Stay tuned.