Starting now this new series of posts I am going to discuss an integration scenario between
Web IDE and
Jira involving one of the latest integration services available in SAP Cloud Platform called
Open Connectors.
Integrate Web IDE and Jira using SCP Open Connectors
Part 1: Open Connectors & Jira |
Part 2: Web IDE Features & Plugins |
Part 3: The UI5 Development |
Prologue
Open Connectors was released in the last quarter of 2018 and it has been receiving a lot of attention from SAP community with different blog posts covering this subject. I provided also my contribution explaining how you can build a custom connector using
Spotify Web API as example. You can find the link to this article below:
Build a new connector in SAP Cloud Platform Open Connectors
Open Connectors provides a lot of pre-built connectors simplifying and accelerating the integration between SAP applications and 3rd party APIs.
After analyzing the list of connectors available I had an interesting idea, instead of focusing on a usual business scenario why not try something new and use this service in a new feature destined to
UI5 developers?
Since I moved to Australia in 2016, I've been noticing that in most part of the SAP projects there are two important software applications present in the daily routine of
UI5 developers:
Web IDE and
Jira (Atlassian).
If these two applications are so important,
why still there isn't any kind of integration between both in the same cloud app?
Maybe the lack of a service to orchestrate multiple parties has increased the complexity of such solution and for this reason, no one was interested to implement this idea before. If this is the case there is no excuse anymore, in this article we are going to explore this interesting scenario and deliver this integration based on the mentioned technologies.
Before we discuss the technical details of this solution let's have a look in both offerings to understand the impact they have in the life of
UI5 developers.
Jira (Atlassian)
Jira is one of the main software applications delivered by
Atlassian, an Australian company that develops products for software developers, project managers and content management.
Jira is used for bug tracking, issue tracking, and project management and it is widely adopted in consulting services and implementation projects nowadays.
In most part of the SAP projects in Australia, we can find
Jira supporting the software or the project life cycle.
Web IDE
As a SAP developer, you probably heard about
Web IDE at some point of time.
Web IDE is a web-based development environment for
SAP Fiori, SAPUI5, and full-stack business apps delivered by
SAP Cloud Platform as a
SaaS (Software as a Service).
Web IDE provides multiple assistants and templates to speed up the development process including additional features (extensions) that make the life of developers easier.
Now that you understand the importance of both applications let's move on and discuss the technical solution proposed by this article.
Technical proposal
To provide integration between
Web IDE and
Jira we are going to explore a lot of different topics. In this series of posts you will learn:
- How to subscribe and configure a new Jira Cloud development instance.
- How to use and configure a pre-built connector offered by SAP Cloud Platform Open Connectors.
- How to publish a new Destination via SAP Cloud Platform.
- How to deploy a new Web IDE Feature & Plugin via SAP Cloud Platform.
- How to adjust a SAPUI5 application to consume data from a 3rd party API and interact with the external provider making use of CRUD operations.
The basic concept is to use
Open Connectors as an accelerator to mediate the message exchange between
Web IDE and
Jira Cloud, the diagram below demonstrates the basic communication flow expected with this solution.
Note: Almost all the knowledge requested by this series of blogs is already available through different articles published in SAP Blogs, I will share the relevant links and references that helped me during my research along the way.
Let's start this development with the configuration of a new
Jira Cloud development instance and the configuration of
Open Connectors.
Setup of a Jira Cloud environment
The first step is to register for a development instance in
Atlassian Cloud, the good news is the development instance is FREE! You can find more information about this offer through the following article
Atlassian introduces new cloud development environment.
To sign up and get access to your free development instance you just need to fill the form available in the link
Get your development environment.
Claim your
site name, provide your
personal information, define a
password and mark the
agreement checkbox. After the last step, your instance is ready to go and you can start the configuration of your workspace.
For the purpose of this article, I created a new instance using the hostname
feliperodrigues.atlassian.net, please remember to adjust the steps of this demo using your own URL.
In your
Jira Cloud instance create a new project based on the
Bug Tracking template with the name of
SAP Blogs Demo.
Create a new issue reflecting a random UI5 development to be fixed. Press the + button on the left menu to create a new incident.
Select the type
Bug, define a
title,
description and press the button
Create.
Open the menu
Reported by me and check your new issue available in the list.
Note: At this stage, we are not exploring all the
Jira features available, for this first blog we just need the basic data to test the API communication,
one project and
one issue are enough for the purpose of this demo. Feel free to explore additional options if you want to enhance your application.
🙂
With the
Jira setup concluded we can move on and start the configuration of a new instance in SAP Cloud Platform
Open Connectors.
Create a new instance in Open Connectors
As I mentioned before, I am going to share some interesting blog posts that supported my research during the run of this new blog series, since we are starting with
Open Connectors configuration I would like to share this blog that covers most part of the features available in this service:
Blog Series: Simplify Integration with third-party application with SAP Cloud Platform Open Connecto...
Let's start our configuration by accessing the
SAP Cloud Platform and activating the relevant service. If the service is already active you will see the status
Enabled under the title (similar to the image below).
Click on the link
Go to Service to start the application in another browser tab.
In the new page check the left menu and select the item
Connectors to open a list with all the available pre-built connectors, search for
Jira and you will find a tile ready for consumption.
Pass the mouse over this tile to show all the options available. The first step is the authentication with the external API, let's proceed with this step by pressing the button
Authenticate.
Note: For the sake of this exercise we use the
Basic Authentication to avoid increasing the overall complexity but
Jira REST API documentation recommends accessing via
OAuth2 in a production environment. If you want to understand how this authorization protocol works you can have a look in my previous article with a good example of a common
OAuth2 authentication flow and all the detailed steps to configure
Open Connectors for this particular case. You can find the link for this article below:
Build a new connector in SAP Cloud Platform Open Connectors
In the next step, create a new instance providing a
Username,
Password and the
Server URL of the
Jira Cloud development environment.
To avoid using your real password there is a simple workaround based on
API tokens. You can find more information about this option through the link
API tokens - Atlassian Documentation.
Let's follow the recommended steps and create a new
API token to access
Jira API. First things first, log in to
https://id.atlassian.com/manage/api-tokens.
Press the button
Create API token and define a concise label, in my case I chose
feliperodrigues-openconnectors.
Confirm by pressing the button
Create. You should receive the token in the next dialog, similar to the example below.
Press the button
Copy to clipboard or select the option
View to visualize the new token. Notice that before the first authentication the
Last accessed field is still marked as
Never accessed.
Get back to
Open Connectors, replace the
Password by the new
API token and finalize the process by pressing the button
Create Instance.
After the authentication, you should receive a success message in the header of the page:
Nice work! You've successfully created a JIRA connector instance
And the following options will be available for consumption.
Before we proceed with the tests of the API let's have a quick look in the
API token one more time to see what happened.
Now the
Last accessed field reflects an update because of the recent authentication triggered by the connector. At any point of time is possible to
revoke this token as a security measure.
Getting back to the new instance, let's confirm if everything is working fine by performing a simple test in one of the methods of this API. Select the option
Test in the API docs and the following page appears.
All the entities from
Jira API are now available through this screen and you can test the basic
CRUD operations. Let's do a quick test selecting the project and incident created at the beginning of this article.
Start by searching for the
projects entity.
Click on the method
GET /projects and press the button
Try Out.
Now you have the option to change some of the parameters before executing the API method. Since at this stage there is no need to adjust the call, just scroll down the container until you find the button
Execute, press the button to trigger the API call.
If everything goes as planned you must see the
HTTP 200 Code informing a successful API call and in the
Response Body you should find the project created via
Jira Cloud with the name of
SAP Blogs Demo.
Note: If you check the
Request URL there is no distinction from the
Jira API or even the current
Open Connectors account, the only thing available in the URL is the entity selected for this call (in our case
projects). If all the connectors and accounts run through the same base URL how is it possible to identify the differences between each one of them?
URL: https://api.openconnectors.ext.hanatrial.ondemand.com/elements/api-v2/projects
The answer is connected with the
Authorization Header. Open Connectors has a specific hash for the authorization based on three different components:
- User
- Organization
- Element
The combination of these parameters defines the route to find the
SAP Cloud Platform account,
Open Connectors sub-accounts and the
Connector / API.
Before we conclude this exercise let's repeat the test using the method
GET /incidents.
Press the buttons
Try Out and
Execute. After the search is finished look the payload in the
Response Body to find the details about our incident.
Configure a SAP Cloud Platform Destination
Before we conclude this first blog I would like to include an extra configuration step that will be necessary for the next parts.
To access
Open Connectors from your cloud application (in our case Web IDE) you need to configure a new Destination in the main cockpit from SAP Cloud Platform. Without this configuration is not possible to access the API via the Web IDE extension.
Open the
SAP Cloud Platform and access
Connectivity -> Destination.
Configure the connection to
Open Connectors API based on the following parameters:
Notice we didn't include an authentication method because the pattern used by
Open Connectors is conceived specifically for this service, in this case, we need to adapt the authorization header via UI5 development.
You can find more information about this topic in the
blog post I shared previously but we will discuss the details about this code adjustment in my next blog.
And this is the end... of part 1 at least.
😉
So, what's next?
In
Part 2 we discuss how we can extend
Web IDE with
Features & Plugins including new events and also new components to the user interface. At the end of the next blog, you will learn how to perform a basic integration scenario between
Web IDE and
Open Connectors API.
In
Part 3 we put more focus on the development process creating the final development with multiple views and a more complex UI integrating
Jira with some of the CRUD operations available through the API.
If you want to follow the next parts don't forget to subscribe to my SAP account and receive notifications about the next releases.
felipedemello.rodrigues
Hope you enjoyed the content and see you next time.
🙂