Developing dashboard items for JIRA

We use JIRA to track tasks and issues on all of our projects, facilitating collaboration and tracking progress; many of our customers also find custom JIRA dashboards very useful. Here's how they work.

At Ghyston, we use JIRA to track tasks and issues on all of our projects. If you’ve worked with us before, you may have seen the Scrum or Kanban board for your project, checked how tasks were progressing through it, perhaps even raised a few tickets or commented on an issue or two. You’ll certainly have seen its most basic features. But the real power of JIRA lies in its many in-built and external plugins. In this blog post, we’ll be talking about the example JIRA plugin we made to help developers build their own.

The wealth of features and plugins offered by JIRA is particularly useful for large projects. Project managers, senior management and interested stakeholders view dashboards of the project – customised overviews with metrics, graphs and lists tracking whatever they need to know about its progress.

After using it for a while, managers often start thinking: “This is great, but I could really do with one more widget to track this metric, or to create a graph of that…” Although Atlassian and third party developers offer a wealth of plugins to buy, there are still many cases where your requirements are simply too specific to your business. For example, we’d love to have a graph that shows dependencies between tasks, right down to producing a colourful Gantt chart of the project’s predicted timescale.

Of course, our response to this is clear: it’s possible to build JIRA plugins, so let’s build our own!

However, integrating with JIRA (especially JIRA Server) is no mean feat. As you'd expect from a feature-heavy application that's been around for many years, there are a lot of conventions and languages to learn – in particular the XML used to declare plugins and dashboard gadgets, and the Velocity templating language. This makes it a steep learning curve for new developers, and also more challenging to write code which is both easy to read and easy to maintain. 

To ease this process, we decided to build a “skeleton” dashboard item, which sets out the structure for building any dashboard items we might need. We took advantage of Atlassian’s own move to a number of new technologies to create the easiest possible experience for developers used to working in a modern tech stack.

Besides the standard Java of JIRA, Atlassian now supports writing dashboard items in modern languages like JavaScript, Soy, and LESS. We took this one step further and added TypeScript support. As part of this, we wrote our own type definition files for some of Atlassian’s JavaScript libraries, which act as in-code documentation for the methods you need to call.

We’ve tried to abstract away the learning curve of JIRA wherever possible, and where not, to give clear and straightforward examples of how the integration with JIRA needs to be done. As part of this, we’ve written a step-by-step guide to adapting the plugin, which is included with the repository.

Everything about the skeleton dashboard item is automated, so that developers can get up and running straight away. Building the plugin with Maven automatically compiles the TypeScript and runs the frontend and backend tests.

To round all of this off, we open-sourced the skeleton dashboard item with the support of our directors. If you have any interest in developing your own JIRA Server dashboard item, please have a chat with us, or simply fork the repository on Bitbucket and get cracking!

Hayley Ross

By Hayley Ross

Share this article: