Build a Slack App in 10 Minutes (or less) with MongoDB Stitch
Slack is not only the fastest growing startup in history, but it’s also an app by the same name and one of the most popular communication tools in use today. We use it extensively at MongoDB to foster efficient communications between teams and across the company. We’re not alone. It seems like every developer I encounter uses it in their company as well.
One interesting thing about Slack (and there are many) is its extensibility. Writing a slash command, or a standalone app is incredibly easy and when you combine the power of MongoDB, and specifically MongoDB Stitch’s backend as a service, the combination enables you to build an incredibly powerful chatbot in minutes. To demonstrate how easy it is to extend Slack using MongoDB Stitch, let’s create a Slack app that stores and retrieves interesting URLs. We’ll call this app URL Stash.
Create a Slack App
Start by logging into your slack team, or you can create a new one for testing. Visit the Slack API Console to create a new Slack App.
You’ll need to have a Slack team or instance where we can install and test URL Stash. I’m going to use the MongoDB Community Slack instance. Once we’ve created the app in our team workspace, we can put the Slack app to the side for the moment and create the other half of the app — the MongoDB Atlas Cluster, Database, Collections, and Stitch app.
Create an Atlas Cluster, Database, and Collection
Stashing URLs implies that we’ll need a place to store them. For this example, we’re going to demonstrate how easy it is to use MongoDB Atlas to do this. We’ll start by logging in to MongoDB Atlas, creating a cluster, a database and a collection. You can start for free and create an M0 class cluster instance. Once you’ve launched your cluster, create a database, and a collection using the collection viewer in Atlas. I called mine exampledb and examplecoll but you may call yours whatever you like. You’ll just need to make sure you reference them correctly in the function we’ll create in Stitch in the next section.
Create a Stitch App
Stitch apps are associated with specific clusters so once you create your cluster, you can click Stitch apps from the left-hand navigation menu in Atlas, then click Create New app.
Create a Service
Services in Stitch are a primary point of integration with the outside world — in this case, Slack. Let’s create an HTTP Service that will provide the integration point between Slack and Stitch.
Click on Services, Add New Service, Click HTTP, and name the service. Click Add Service. Then, in the settings tab, name the incoming webhook something meaningful. I chose “slack” but you may name this anything you like. The webhook will provide an external web address that will be plugged into your Slack app.
Plugging in this webhook URI, will tell your Slack app to send certain details of the conversation from Slack to your newly created Stitch Application.
This is where the magic happens. In just a few minutes, we created an integration between Slack and Stitch. The simple act of setting some configuration (naming) for your service is all that’s required. Let’s turn our attention to the code that we’ll use to store, and retrieve URLs for our Slack users.
The heart of a Stitch Service is the function that’s run when it receives an incoming request via its Webhook URL. In this case, we chose to respond to POST requests. In Slack, we’ll send the data from a slash command via POST to our Stitch function. We’ll evaluate the text that the user sends as part of the slash command and either stash a URL, or list out the existing URLs that have been previously stashed.
Since the function is receiving the details from Slack, we’ll enable a simple set of commands after the slash command itself. We’ll want users to be able to store URL’s, so we’ll use the command format:
/url stash [url]
And since we’ll want users to be able to review the URL’s that have previously been stashed, we’ll enable a “list” option:
And lastly, since we’ll want users to be able to remove URLs that they’ve previously added, we’ll enable a “remove” option:
/url remove [url]
Example Function for Slack HTTP Service in Stitch
The heart of our function is the switch statement which evaluates the text sent to the command by the Slack user.
Create a Slash Command
Let’s complete the final step in the process and add a slash command to our Slack App. To do this, head back over to the Slack app console and click “Slash Command”.
Creating a slash command in Slack
Name your slash command. Keep in mind you’ll need to grab the MongoDB Stitch service webhook URI that we created in the previous section above. Once you save this slash command you should select Install Your app from the left hand navigation in Slack’s app Management console.
This will prompt you to confirm your identity on you slack team and authorize the app to be used in your workspace.
Authorize app Installation
Once this is complete, your app is nearly done. You can switch back to your Slack client, visit your own personal chat channel for privacy while you test and type your newly created Slack slash command. For example “/url stash http://mongodb.com”. Pressing enter will send the command to Slack and then to your newly created Stitch app. You should see something like following in response:
It’s just that simple, you’ve created a fully functioning Slack Chatbot, or at least a slash command with only a few lines of code and no servers involved!
This is merely a starting point and you should now easily be able to build additional functionality into your new Slack App. To review more details and fork the project, head over to the GitHub Repository.
Check out the video screencast walk through.