GitHub issues are fantastic to track new features or bugs, who is assigned, categorize them, adding to projects and so on. They’re also quite slow to create, and creating a bunch of them takes way too long. So I created a little tool to speed up issue creation and make it a breeze.
One of the pain points I see with GitHub issues at work is that they’re cumbersome to create, particularly for those that are not developers, like managers, designers or testers, and that simply want to report a bug but don’t go through the process of creating them on GitHub.
Creating GitHub issues should be fast
So what’s the easiest interaction with computers, writing, maybe? I don’t know if it’s the easiest, but it’s definitely easy. So in this simple text box, issues can be written and each line will be an issue. You just type and type and don’t lift your hands off the keyboard to grab the mouse. You can also paste a list created in a text editor or spreadsheet.
It has flexibility: you can assign the issue to someone (or many, separating usernames with commas) separating the title from the username with a pipe character. Another pipe separates the description, and yet another pipe separates the labels, that can be many, separating them with commas.
This project is still not fully fleshed out but it’s already public at
As a general overview:
- it’s a GitHub app that can be installed in the repository where the issues will be created
- has a Node.js backend with Express as the server
- the front end is built with React
- key libraries to work fast with GitHub in Node were https://github.com/octokit/app.js and https://github.com/octokit/rest.js/
One thing to keep in mind is that we don’t want to hit the API limits. GitHub recommends to let at least one second go by between requests. I paused the script 1.5 secs between each issue creation request, that’s why you’ll see in the GIF above that the issues are not created instantly.
I showed this to a friend and he told me that he had this idea of creating a Chrome extension to take a screenshot of a bug, annotate it, and submit it as a GitHub issue. I thought it was a great idea and I looked for a way to take a screenshot but inside a React app and quickly found html2canvas that allows to take screenshots and save them as PNG files.
Combining something like this with my tool to create the issues would be a nice solution that could be available in a React app during its development or staging cycle. Anyone testing the app could fire the issue reporting panel and submit a GitHub issue. The image would still have to be stored in another server, because as of now, the Issues API is limited and doesn’t allow to upload images.