Developers Hate Him! One Weird Trick To Easy Slack Slash Commands
Here’s the trick: Use Howdy’s excellent Botkit. The documentation is excellent, it’s actively developed and has been put through its paces.
We’re going to cover how to get a Slack slash command developed using Botkit, backend deployed to Heroku, database deployed on MLab, with a working “Add to Slack” button. This guide assumes a comfortable knowledge of NodeJS, npm and Heroku.
l e g g o
npm install --save botkit botkit-storage-mongo
npm install -g localtunnel
We’re installing Localtunnel to expose our local Slack app backend to the world. This allows us to develop locally and test on any Slack Team without deploying to a server.
You’ll notice that some environment variables are used here. A Slack client secret, client ID and verification token. As well as an optional Mongo URI.
Create a new Slack app to get Slack related credentials. Set your OAuth Redirect URI to https://YOUR_APP.localtunnel.me/oauth. Create a new Slash Command and set the Request URL to https://YOUR_APP.localtunnel.me/slack/receive. Update line 41 above to the Slash Command you’ve created.
SLACK_CLIENT_ID=YOUR_SLACK_CLIENT_ID SLACK_CLIENT_SECRET=YOUR_SLACK_CLIENT_SECRET SLACK_VERIFICATION_TOKEN=YOUR_SLACK_VERIFICATION_TOKEN node botkit-simple.js
You should have a working local Slack App backend now! Let’s use Locatunnel to expose your local backend to the world such that Slack can use it.
lt --port 3000 --domain YOUR_APP
Visit https://YOUR_APP.localtunnel.me/login to install the Slack app to your Team. Once installed, your Slash Command should be available!
Make updates to your code (try out nodemon for live reloading), keep localtunnel running and your updates should be coming through to the Slack Team(s) you’ve installed your Slack app on.
l e g g o d e p l o y m e n t
Botkit uses local JSON file storage to store Slack User and Team credentials. This is fine if you’re deploying to a server, but if you’re deploying to services like Heroku or AWS Elastic Beanstalk your credentials won’t persist between deployments.
Multiple Botkit storage modules are available and you could even roll your own. We’re lazy and this is ez so we’ll be using Mongo and specifically a MLab database.
Sign up, create a database and user. You should have a standard MonogDB URI that looks like this (replace <dbuser>, <dbpassword> and <dbname> with your database credentials).
mongodb://<dbuser>:<dbpassword>@ds017283-a0.mlab.com:17283,ds017283-a1.mlab.com:17283/<dbname>?replicaSet=rs-ds017283
Set the above as the MONGO_URI environment variable and your Slack app should now be using your MLab database for Slack User and Team credential storage.
To deploy to Heroku, create a new Heroku application, commit your code to master (you better have been using git, son) and then…
git push heroku master
Set the environment variables either through the web dashboard under your app’s Settings > Config Variables or with the Heroku Toolbelt. The environment variables should be the same as what you used locally, except also set a PORT variable to 80.
You should now have a publicly deployed Slack app to Heroku with a domain that looks like https://YOUR_APP.herokuapp.com. Go back to the Slack app you’ve already created and update the OAuth Redirect URI and Slash Command Request URL with the Heroku URL.
Finally, the “Add to Slack” button
<a href="https://YOUR_APP.herokuapp.com/login"><img alt="Add to Slack" height="40" width="139" src="https://platform.slack-edge.com/img/add_to_slack.png" srcset="https://platform.slack-edge.com/img/add_to_slack.png 1x, https://platform.slack-edge.com/img/add_to_slack@2x.png 2x" /></a>
DONE. 💪
Tweet at me with the Slack apps you’ve made following this guide. Spitsy used Botkit but was deployed to AWS Elastic Beanstalk because Heroku complained a little too much about timeouts.
