My experience creating – Movie for boredom with AppGyver (shake it) – No-Code Challenge
In this article I will try to relate my experience as a SAPUI5 and CAP/ABAP developer using SAP AppGyver to accelerate application development.
This application is created in the context of the SAP challenge described in Daniel’s blog https://blogs.sap.com/2022/05/04/no-code-challenge-0-code-100-app-and-hoodies/.
This is the result: https://shakemoviessap.appgyverapp.com/
The purpose of this application is twofold, on the one hand to test the integration with the mobile phone sensors and on the other to create an application that randomly recommends films.
My app – Movie for boredom
The idea is simple. A screen that by shaking the mobile phone randomly proposes films from the public API https://www.themoviedb.org/. As you can imagine you need a mobile phone to use the app.
As you can imagine you need a mobile phone to use the app.
This is the first screen, a little menu:
When we enter the “random movies” option, we activate the button and shake the phone. When some film appears, you can save this film into device or shake again to see another suggestion:
You can retrieve the films you have saved using the option “my saved films”.
Finally, you can access detailed information on each of the films.
It has been exciting to see how, by investing little time, I have been able to create an application integrated with the sensors of the mobile phone.
I will detail some of the challenges:
- Connect to a free, public REST/OData service: I have been impressed by the ease of connecting to external APIs. It allows you to create the data source and the model in a fast and agile way.
- Create a data store on your device: This part if you are programming with traditional languages is much more expensive, as installing libraries, configuring connections. With Appgyver you just drag, drop and the magic happens.
On the negative side, the internal database works with an ID + a data element. So you can’t create records with several keys, nor delete records using filters. But with a bit of imagination it’s easy to solve it.
- Incorporate native capabilities of your mobile device (e.g., camera, telephony, GPS, contacts): The part that has taken me the longest, The part that took me the longest, to give you an idea, is the sequence I created to detect the movement of the phone.
Even so, the creation of this functionality has been faster than creating it natively and without the need to have knowledge of the operating system (iOS, Android).
- Use a formula: As if it were an excel spreadsheet, thanks to the wizard it is very easy to create formulas. This application is full of formulas to process the data.
In this example, the formula allows me to add a new item to the list displayed on the screen.
- Create at least 3 pages and a menu for navigation within your app: One of the things I loved is that the navigation between screens is created in 30 seconds.
This example allows us to select an item from the list, and to navigate to the detail by passing a parameter
- Use one item from the Component Marketplace or Flow Function Market: The Marketplace contains many extra functionalities that we can extend
The components of the marketplace have allowed me to integrate the accelerometer reading and the vibration of the mobile phone with a simple “install”.
- Create a composite component: One of the things we do in development is to reuse functionality. With Appgyver it’s no different. In my case, there is one component that I had to repeat over and over again, the footer.
By dragging the component to the different pages I was able to create the same footer for the whole application in seconds.
- Set the theme, and change the colors of your components: Another thing that may seem unique to developers is customisation. But with Appgyver I have been able to modify the styles of each component very easily.
- Build and deploy your app to SAP AppGyver server: I haven’t tried the publishing part in the different markets (Android, iOS) but the generation of the web application has been easy and fast. Also very useful is the texting mode by installing the AppGyver application for mobile phones.
As you can imagine we have several limitations, one is that we need a mobile phone for this app, the second is that we need to access with the APPGyver application or compiling the project to read the accelerometer information.
It has been a very interesting challenge to get to know AppGyver. I think I have also solved the wiggling problem successfully and in record time.
The learning curve was very fast and I was able to have the application ready in 4 days. So it is a great option for users who do not know how to develop to create applications autonomously or for developers to come up with solutions in record time.
Great idea, thanks for sharing your feedback Enric Castella! 👍🏻
Thanks for your feedback Pierre!
This is awesome Enric. No doubt it will spark ideas for others to design something cool!
Thank you very much for the support!
I love this idea, and I've never seen the shake feature used like this before! Super cool 😀
That's very cool.
I'm trying to replicate it to learn how to use the sensors. I think I understand what's happening in your logic, guessing that you are comparing if the latest output on some axis in the accelerometer has changed in the past 2 ms if there was an initial change in the past 5ms. However, I can't seem to figure out what the first step is? Please, could you shed a little light? Thank you!