More with UI5 and APIs

If you are ready to try adding some more advanced code to your API application, I have 3 new tutorials that will guide you through additional topics such as adding paging to your API calls, adding navigation to application, and nesting additional API calls. This series continues using Slack as our example API. As always, if you are following along with another API, don’t hesitate to ask questions. Do you have a topic you would like to learn more about for your API application? Add a comment to this blog! We are always looking for tutorial suggestions that will help you, our community, learn the most about SAP products.

The next tutorial in this series will introduce paging to your application. You can use paging to reduce the amount of data returned in an API call to help with performance as well as usability. If you display too much information or too many rows, the end user of your application might have a hard time finding the data they need. The important concepts with paging are understanding your datasets bounds. You need to know where your data starts and ends for each page, as well as with the whole dataset. This allows you to determine if there is an additional page of newer or older data based on the current pages bounds. This tutorial guides you through how to set up the paging buttons on the view and the controller code to determine when to enable and disable those buttons, as well as the logic to add paging parameters into your AJAX call.

Continuing with the series will take you to the navigation tutorial. This tutorial will show you how to enable routing in your application. While you should limit detail showed on the main page, the new detail page should be used to show specific and detailed information on the item selected from the main page.  As part of this tutorial, you will create a new detail view and controller, and you will add code to allow you to navigate from the main view to the detail view and back. While Slack Messages don’t have a great amount of data, this could be very beneficial with an API that has a more detailed object, such as an Eventbrite event.

The final tutorial in this series is to nest an additional API call. Some API calls only return limit information about an object and it will be necessary to make an additional call to get more information. If the initial API contains a unique identifier for another object or method, you can retrieve that property from the data set and use it in another AJAX call to return either another object or more information on the current object. A Slack Message contains the user id for the author of the method, so you will use this user to get the Slack User object. Once you have the Slack User, you can display the user’s real name or username to make it more readable for your end user.

Slack provides simple objects and small datasets to get started on integrating an API into your application. Some of these more advanced topics will make more sense with larger datasets or more complex objects. Stay tuned for an example of these topics with the Eventbrite API to learn more about paging, navigation, and nesting and their many benefits.