Replacing Web App with Slack Dialogs

Posted on Fri, 03 November 2017 in development

cover image, hand holding a seashell

Slack released awesome new feature called Dialogs a couple of weeks ago. Dialogs… Awesome?

Simply put, yes. Awesome. When combined with slash commands, it’s rather easy to replace a multitude of custom tailored Web Apps with UI built completely within Slack. Here’s one example.

Use Case

A user needs to read a couple of utility meters (water, district heating, electricity) manually at the beginning of each month, and store the readings to a database.

Previously I had built a simple web form application for the data entry. I wanted to replace the app with Slack features, e.g. to simplify workflow for the end user (no need to login to a separate app) and on the other hand lessen the maintenance work needed. In this case a full web app with just a couple REST APIs.

Solution

Dialogs can be invoked through interactive messages or slash commands. I chose to go with slash command.

slash command image

After invoking, user is greeted with a dialog

dialog image

Then it’s only necessary to select the correct time series

dialog image

… enter the reading value and submit the form.

The submission sends a POST request to an API endpoint, which receives the data and stores it to a database for future use.

All that is needed, is configuring a new Slack App, a new slash command and couple of REST API endpoints, which receive data from Slack and return correct information for the dialog content.

Simple for the user, simple for the app developer!

Further reading