Serverless integration of JIRA using Kumologica
Tags: aws, microservices, serverless
Published: 2020-07-10 14:13:34

![Jira Service Desk](https://miro.medium.com/max/1400/1*Y0TS8tMfLnWg4cFQkM42GA.png)

In this article we will create “Contact Us” HTML form that is present on most of websites and integrate it with [Jira Service Desk](https://www.atlassian.com/software/jira/service-desk) using [Kumologica Designer](https://kumologica.com/download.html) flow running on AWS Lambda.

If you want to learn more about Kumologica, I would highly recommend you to check out the [articles](https://medium.com/@kumologica/) or subscribe on the [youtube channel](https://www.youtube.com/channel/UCsTDAlhijUFpsfThJu3hF9g)

## Prerequisites

**Jira Service Desk**

If you don’t have access to Jira software or Jira Service Desk you can [create free account](https://www.atlassian.com/software/jira/service-desk/free). Once account has been created you will be given your site url (ends with atlassian.net) for your Jira Service Desk Instance.

Next Step is to create API Key. Navigate to: *Settings icon* (in the top right corner) > *Atlassian account settings > Security* (in the left panel) > *Create and manage API tokens >Create API Token.* Enter label for token and press *Create,* you will be presented API token. Copy it as you will need this token to authenticate from Kumologica flow.

![Create API Token for Jira Service Desk](https://cdn-images-1.medium.com/max/3804/1*VDEPRZqvXq6lWt2555Ty5A.png)

We will be using *General service desk (GSD)* example project that has been created for us. The GSD is a project id that we will be using in Kumologica flow.

## Building orchestration flow

Once we have access to Jira configured we can start building our Kumologica flow.

**Create New Project**

Open Kumologica Designer, click the *Home* button and choose *Create New Kumologica Project*. Enter name (for example jira-demo), select directory for project and switch *Source* into *From Existing Flow …*

![New Kumologica Project with importing flow](https://cdn-images-1.medium.com/max/3444/1*mm9w9yeg7fP80UJ854Rh0g.png)

Copy and Paste the following flow:

```json
[{"id":"main.flow","type":"tab","label":"main","disabled":false,"info":""},{"id":"test.flow","type":"tab","label":"test","disabled":false,"info":""},{"id":"eacbb9ef.69d5c8","type":"EventListener","z":"main.flow","name":"POST /issue","eventSource":"api","dynamodbOperation":"","apiMethod":"post","apiUrl":"/issue","albMethod":"any","albUrl":"","bucketName":"","event":"s3:ObjectCreated:*","x":122.5,"y":140,"wires":[["dcdb6a8a.2ba208"]],"caname":"aws-event-handler","category":"aws"},{"id":"b5fc6ccd.17dd7","type":"EventListener-End","z":"main.flow","name":"Success","statusCode":"200","headers":{"Content-Type":"application/json"},"payload":"{}","x":502.5,"y":140,"wires":[],"caname":"eventlistenerend","category":"aws"},{"id":"3aa032bd.826cae","type":"TestCase","z":"test.flow","name":"Test POST /issue","selectedTargetNode":"eacbb9ef.69d5c8","payload":"{\n  \"path\": \"/issue\",\n  \"headers\": {\n    \"Accept\": \"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8\",\n    \"Accept-Encoding\": \"gzip, deflate, lzma, sdch, br\",\n    \"Accept-Language\": \"en-US,en;q=0.8\",\n    \"CloudFront-Forwarded-Proto\": \"https\",\n    \"CloudFront-Is-Desktop-Viewer\": \"true\",\n    \"CloudFront-Is-Mobile-Viewer\": \"false\",\n    \"CloudFront-Is-SmartTV-Viewer\": \"false\",\n    \"CloudFront-Is-Tablet-Viewer\": \"false\",\n    \"CloudFront-Viewer-Country\": \"US\",\n    \"Host\": \"wt6mne2s9k.execute-api.us-west-2.amazonaws.com\",\n    \"Upgrade-Insecure-Requests\": \"1\",\n    \"User-Agent\": \"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.82 Safari/537.36 OPR/39.0.2256.48\",\n    \"Via\": \"1.1 fb7cca60f0ecd82ce07790c9c5eef16c.cloudfront.net (CloudFront)\",\n    \"X-Amz-Cf-Id\": \"nBsWBOrSHMgnaROZJK1wGCZ9PcRcSpq_oSXZNQwQ10OTZL4cimZo3g==\",\n    \"X-Forwarded-For\": \"192.168.100.1, 192.168.1.1\",\n    \"X-Forwarded-Port\": \"443\",\n    \"X-Forwarded-Proto\": \"https\"\n  },\n  \"pathParameters\": {\n    \"proxy\": \"issue\"\n  },\n  \"requestContext\": {\n    \"accountId\": \"123456789012\",\n    \"resourceId\": \"us4z18\",\n    \"stage\": \"test\",\n    \"requestId\": \"41b45ea3-70b5-11e6-b7bd-69b5aaebc7d9\",\n    \"identity\": {\n      \"cognitoIdentityPoolId\": \"\",\n      \"accountId\": \"\",\n      \"cognitoIdentityId\": \"\",\n      \"caller\": \"\",\n      \"apiKey\": \"\",\n      \"sourceIp\": \"192.168.100.1\",\n      \"cognitoAuthenticationType\": \"\",\n      \"cognitoAuthenticationProvider\": \"\",\n      \"userArn\": \"\",\n      \"userAgent\": \"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.82 Safari/537.36 OPR/39.0.2256.48\",\n      \"user\": \"\"\n    },\n    \"resourcePath\": \"/{proxy+}\",\n    \"httpMethod\": \"POST\",\n    \"apiId\": \"wt6mne2s9k\"\n  },\n  \"resource\": \"/{proxy+}\",\n  \"httpMethod\": \"POST\",\n  \"queryStringParameters\": {\n    \"name\": \"me\"\n  },\n  \"stageVariables\": {\n    \"stageVarName\": \"stageVarValue\"\n  },\n  \"body\": {\n  \t\"name\": \"issue\",\n    \"message\": \"issue description\",\n    \"email\": \"aa@aa.com\",\n    \"issueType\": \"Submit a request or incident\"\n  }\n}","initialLoad":"false","x":262.5,"y":160,"wires":[["e0721cc7.653eb"]],"caname":"test-case","category":"testing"},{"id":"e0721cc7.653eb","type":"TestCaseEnd","z":"test.flow","name":"TestCaseEnd","x":425,"y":160,"wires":[],"caname":"test-case-end","category":"testing"},{"id":"dcdb6a8a.2ba208","type":"JIRA","z":"main.flow","name":"Create Issue","operation":"Issuecreate","issueNumber":"DP-5","host":"YOURACCOUNT.atlassian.net","password":"API TOKEN","username":"YOUR USERNAME","priority":"","description":"\"From: \" & msg.payload.email & \", Description: \" & msg.payload.message","issuetype":"msg.payload.issueType","project":"GSD","summary":"msg.payload.name","comment":"","commentId":"","transitionName":"Close Issue","x":302.5,"y":140,"wires":[["b5fc6ccd.17dd7"]],"caname":"jira","category":"platforms"}]
```

press *Create* Button.

**Install Jira Plugin.**

Jira node is a contribution node and must be explicitly installed in Kumologica Designer. Press *Add more nodes* button located in the bottom left corner of designer. You will be presented screen with all contribution nodes that are currently available. Choose JIRA node, press *Install* button. After few seconds, plugin will be installed and you will be prompted to restart Kumologica Designer. Jira node will be located under new category: *Platforms* after restart.

![Kumologica Contribution Nodes screen](https://cdn-images-1.medium.com/max/4164/1*R-EACoMmMZmg0v4nwiPSTw.png)

**Edit flow**

After installing JIRA node, the imported flow will look like below:

![Jira Demo Flow](https://cdn-images-1.medium.com/max/2464/1*wSyVHialP68gf45UVnjSdQ.png)

Click on the *Create Issue* Jira node to display its properties and change *Jira Connection Details* section:

* Host URL: enter the url that has been created for your Jira service desk instance (ends with atlasian.net)

* Username: the user name you setup when creating account or the username you use for your jira instance

* API Token: token created in Prerequisites section

Press *Save* button to return to the flow.
> We have put connection details directly into properties for simplicity. We recommend to use AWS Parameter store to store secrets and use Kumologica AWS SSM Node to retrieve them.

**Deploy flow to AWS Lambda**

Select *CLOUD* tab on the right panel of Kumologica designer, choose AWS Profile and press *Deploy* button. This will trigger build and deployment of flow into AWS Lambda. After short while you should see the API gateway url that has been created for your flow in the terminal:

![Terminal after successful deployment](https://cdn-images-1.medium.com/max/3928/1*IzpMHqdDeCCzihcbcZiDbg.png)

## Contact Us HTML form

Below is a sample “Contact Us” html form, save it in local drive. Change line 18 to use the API Url that was displayed in Kumologica Designer terminal after successful deployment to AWS Lambda. Don’t forget to append it with /issue to call right service.

```html
<!-- Original bootsnipp https://bootsnipp.com/snippets/83Br -->
<html>
    <head>
        <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
        <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
        <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
        <style>
            body {padding-top:20px;}
        </style>
    </head>
    <body>
        <div class="container">
            <div class="row">
            <div class="col-md-6 col-md-offset-3">
                <div class="well well-sm">
                 <!-- Replace value of action with the url of API that has been displayed in Kumologica Designer console -->
                <form class="form-horizontal" 
                      action="https://YOURAPIID.execute-api.YOURREGION.amazonaws.com/test/issue" 
                      method="post">
                <fieldset>
                    <legend class="text-center">Contact Us</legend>
            
                    <div class="form-group">
                        <label class="col-md-3 control-label" for="name">Summary</label>
                        <div class="col-md-9">
                            <input id="name" name="name" type="text" placeholder="Your name" class="form-control">
                        </div>
                    </div>
            
                    <div class="form-group">
                        <label class="col-md-3 control-label" for="email">Your E-mail</label>
                        <div class="col-md-9">
                            <input id="email" name="email" type="text" placeholder="Your email" class="form-control">
                        </div>
                    </div>
            
                    <div class="form-group">
                        <label class="col-md-3 control-label" for="issueType">Issue Type</label>
                        <div class="col-md-9">
                        <select class="form-control" id="issueType" name="issueType">
                            <option>Task</option>
                            <option>Ask a question</option>
                            <option>Submit a request or incident</option>
                        </select>
                        </div>
                      </div>

                    <div class="form-group">
                        <label class="col-md-3 control-label" for="message">Your message</label>
                        <div class="col-md-9">
                            <textarea class="form-control" id="message" name="message" placeholder="Please enter your message here..." rows="5"></textarea>
                        </div>
                    </div>
            
                    <div class="form-group">
                        <div class="col-md-12 text-right">
                            <button type="submit" class="btn btn-primary btn-lg">Submit</button>
                        </div>
                    </div>
                </fieldset>
                </form>
                </div>
            </div>
            </div>
        </div>
    </body>
</html>
```

Open html file in your browser, fill up details and press *Submit* button.

![Contact Us HTML form](https://cdn-images-1.medium.com/max/2448/1*AWwkTPowVC9KWKeabvAOkA.png)

The browser should display empty json: {}. When you switch to your Jira Service Desk *General service desk* project you should see new issue created with following details:

![Jira issue created](https://cdn-images-1.medium.com/max/4024/1*D2G0GwuLj7Jaf-AgmrElPg.png)

As you can see, the properties set in Kumologica Jira node mapped *Summary* into *Title*, *Your E-Mail* and *Your Message* got concatenated into *Description*.

## **Conclusion**

This article presented how easy Kumologica Designer flow orchestrates and integrates with Jira software using Jira node. Within few minutes we have setup Jira Service Desk, created and deployed Kumologica flow and finally created simple contact us html form that calls flow and creates issue in Jira.

Remember Kumologica is totally free to [download](https://kumologica.com/download.html) and use. 

In the meantime, if there is any specific use case that you would like to see in a future article please let us know in the comments section.

## Resources

Code used in this article is available in Github repository:
[Repo link](https://github.com/KumologicaHQ/kumologica-demos/tree/master/jira)

Feel free to check it out and change for your needs.