Build a “Serverless” Slack Bot in 7 Minutes with Node.js and Autocode
Slack bots — they’re useful for sending notifications to your team, creating welcome messages when new users join a channel, and more.
Today we’ll be going over how to build a Serverless Slack Bot in 7 Minutes from a Basic Slack App template. This bot will (1) respond to a /hello command and (2) welcome members when they join a channel. To build it we’ll be using Autocode, the Node.js webhook, script and API automation platform. It offers a bunch of great features; a code editor that has baked-in API autocomplete, serverless hosting, API authentication management, webhook signing, revision history, API version control and more — all for free.
Without further ado, let’s begin!
What You’ll Need for this Tutorial
Minute 1: Prepare your Slack Workspace
The first thing you’ll want to do when building a Slack app is make sure you have a clean Slack “development” workspace to start testing in, just to make sure you’re not interrupting your co-workers with your Slack app. Don’t worry about migrating to your production workspace, Autocode handles auth to multiple Slack workspaces and the differentiation between development and production environments seamlessly.
You can create a new Slack Workspace by clicking here.
We recommend having a #general and #random channel set up as easy message targets when playing with a new Slack app.
Minute 2: Autocode Account Setup
Autocode is a webhook, scripting and API automation platform that uses Node.js to allow you to really easily build and host web endpoints. To sign up for Autocode, simply visit https://autocode.com/signup/ and follow the instructions.
From here, you’ll be brought through a simple onboarding flow to introduce you to the platform.
Minute 3: Visit the “Slack Example” Source Code
The first thing you’ll want to do is take a look at the Basic Slack Example source code, available at https://autocode.com/src/slack/basic-slack-example/. Here you you can see a summary of the project code and endpoints.
From here, you can view the two individual endpoints;
(1) The /hello command endpoint at /events/slack/command/hello/:
https://autocode.com/src/slack/basic-slack-example/functions/events/slack/command/hello.js
(2) The member_joined_channel event endpoint:
https://autocode.com/src/slack/basic-slack-example/functions/events/slack/member_joined_channel.js
On each endpoint we’ll see a summary of how they work and which APIs they talk to:
Minute 4: Fork the “Basic Slack App” Source Code
On the top of the Basic Slack Example Source Code you’ll see a Fork button. Click it to name your forked project and hit Create Fork to finalize details.
Once you’ve clicked Create Fork, wait a moment for your project to be created and open in the Autocode editor:
Voila! You now have a project ready. Only a few steps left!
Minute 5: Link Your Slack Workspace
You’ll notice in your new Autocode project that there’s a jumping red button that says 1 Account Required. You’ll need to click it to open the account linking dialog.
You’ll be prompted with the following screen:
Click Link beside the Slack row to prompt you to link a Slack account…
Click Link New Resource. You’ll be prompted with the option to Install Autocode App or build a Custom Internal Application (Advanced). For the purpose of this tutorial, choose Install Autocode App and click Finish.
You’ll be prompted by Slack to install the app. Make sure you select the correct workspace!
Once you click Allow, the last step is to customize your Slack app. You can set a custom name and profile image. If you don’t mind using the defaults, you can just click Finish.
You’ll now see that your app is linked! You can click Finished Linking to get back to your project.
Minute 6: Test and Deploy your Slack Bot
In the left of your editor, click on:
functions > events > slack > command > hello.js
Now click Run Test Event in the bottom right. A Running... dialog will appear that should complete in a few seconds. Afterwards it’ll look like this:
Awesome! If we check our Slack workspace in the #random channel we should see this:
If we want to change the payload (sample data) being sent to our bot, we can click Edit Test Event Payload in the top of the editor.
Note: Your bot is not yet deployed! Once you’re happy with functionality, to deploy your bot, simply click the Deploy button in the bottom left of the editor:
Your API (webhooks) for your Slack app are now live. To test your newly deployed bot, use /cmd hello from Slack. Note that all commands build via the Autocode app require you to prefix command executions with /cmd command-name instead of just using /command-name. The latter is available via custom apps which require a little more setup.
Congratulations! You now have a working Slack bot with a hello command and a member_joined_channel event.
Minute 7: Shipping to Production, Modifying
You may have noticed the fact that your bot’s name is suffixed with (development) and that you get some debug logs. You probably don’t want this in a production workspace! Shipping to production is easy. Once you have a live bot in development, go to https://autocode.com/manage and find your bot. You’ll see a bright green Ship Release button next to your live development API. Click it.
This will open up a Ship Release dialog with three tabs: Secrets, Linked Resources, and API Version. The most important tab here is Linked Resources which is where you can link your production Slack workspace credentials.
Once you’ve filled out your environment secrets, linked your accounts, and entered an API version you’ll be able to ship. Just click Create Release when ready!
We’ve now released your API, which will handle all of your Slack webhooks. Modifying your Slack app from here is simple, just visit autocode.com/manage and edit your Sandbox. You’ll need to deploy to a dev environment and then ship a new release to push new changes to production.
That’s it! Your Slack App is live!
Thanks for reading, and we hope we’ve been helpful showing you how easy it is to create a Slack App using Autocode! Feel free to dig around the Basic Slack App Source Code and make modifications or add new features. If there’s something you think the source is missing, please feel free to publish your own. The community would love more examples!
We would love for you to comment here or e-mail me at keith [at] autocode [dot] com, or follow us on Twitter, @AutocodeHQ. Please let us know if you’ve built anything exciting that you would like us to feature or share!
