In this guide, we will continue to explore Slack APIs. In just a few steps, we will create a Slack app to privately welcome and guide new users when they join a Slack channel. We’ll breeze through the setup process, and you’ll be able to return to make modifications and add your own style and custom message for a unique workspace onboarding experience!
We’ll be using Autocode to prepare everything for our app. We do not have to set up servers and infrastructure — and the best part is that our code will be autogenerated for us and immediately available to edit if we desire 🙌🏼
What You’ll Need Beforehand
- 1x Slack Team
- 1x Standard Library account
- 1x Creative and Daring Soul
Let’s get started!
Our Slack app will post a message which will be visible only to the user when they join a channel! In the screenshot below, notice how Welcome App’s message is only visible to Janeth, who has just joined #testingbots channel.
Part 1: Sign in to Autocode on Standard Library
Head over to Autocode on Standard Library and sign in or create a free account. If you have a Standard Library account click Already Registered and sign in using your Standard Library credentials.
You’ll notice prebuilt templates for building webhooks, scheduled tasks, Slack slash commands, and Stripe workflows. Select “Blank Prototype new code.”
You will be re-directed to a coding interface, but we’ll use Maker Mode to set up our Slack app. Select Switch to Maker Mode (Beta) button on the left.
Maker Mode is a workflow builder like Zapier, IFTTT, and other Automation tools, with some important differences. Maker Mode guides, teaches, and introduces Makers to code instead of abstracting it all away.
Once on Maker Mode, you’ll notice Autocode API Wizard — a drop-down menu interface for quickly setting up workflows and automation using APIs on Standard Library’s registry. As you interact with Autocode’s API Wizard you’ll be able to see the code autogenerated for you on the right.
Part 2: Configure Slack APIs on Autocode API Wizard
On the first drop-down menu, select Slack as your event source and member_joined_channel as the event.
When you make this selection, Autocode adds two additional steps to your workflow.
This first step sets an HTTP endpoint that will act as a webhook for a Slack member_joined_channel event. When a new member joins a channel, a payload of information for that event is sent from Slack to the HTTP endpoint. The code inside the endpoint then executes and can use the information.
Step #2 Makes an HTTP GET request to the lib.slack.conversations[‘@0.2.5’] API and uses the info method to retrieve the channel object which has info about the channel including name, topic, purpose etc and stores it in result.slack.channel. The parameter to retrieve channel information is automatically set to ${event.event.channel} — leave as is.
Step #3 Also makes an HTTP GET request to lib.slack.users[‘@0.3.32’] and uses theretrieve method to get the user object which has info about the user and stores it in result.slack.user. The parameter to retrieve user information is automatically set to ${event.event.user} — leave as is.
Parameters are like blank spaces for us to fill when calling an API — it’s a way for us to feed the API information it needs to perform an action, like using the parameter provided to fetch an object.
Part 3: Set up a Private Slack Message
Add a final API to this workflow by selecting the + button. Choose Slack as your API provider and Create a new Ephemeral Message from your Bot as the API that will be triggered.
This step in our workflow makes an HTTP POST request to lib.slack.messages[‘@0.5.11’] using the ephemeral.create method to create and post a message that’ll be visible only to a new member.
Configure your API call with the following parameters:
channelId:${event.event.channel}
userId:${event.event.user}
text: 👋 Hello ${result.slack.channel.name} ! Welcome to our #${result.slack.channel.name} channel.
Part 4: A Closer Inspection of our Code on Developer Mode
Click on the generated code to switch to Developer Mode.
The first line of code imports an NPM package called “lib” to allow us to communicate with other APIs on top of Standard Library:
const lib = require(‘lib’)({token: process.env.STDLIB_SECRET_TOKEN});
Line 3–7 is a comment that serves as documentation and allows Standard Library to type check calls to our functions. If a call does not supply a parameter with a correct (or expected type) it would return an error.
Line 8 is a function (module.exports) that will export our entire code found in lines 8–37. Once we deploy our code, this function will be wrapped into an HTTP endpoint (API endpoint) and it’ll automatically register with Slack so that every time a member_joined_channel event happens, Slack will send the event payload for our API endpoint to consume.
Lines 24–32 creates and posts your message using the information (parameters) that are passed in: channelId, UserId, Text.
You can read more about API specifications and parameters here: https://docs.stdlib.com/connector-apis/building-an-api/api-specification/
Part 5: Link a Slack Account & Deploy your Workflow
Before we can deploy our code live, we need to link Select the 1 Account Required red button which will prompt you to link a Slack account.
Select Link Resource from the Identity Management Screen
If you’ve built Slack apps with Standard Library, you’ll see existing Slack accounts, or you can select Link New Resource to link a new Slack app.
Select Install Standard Library App.
You should see an OAuth popup that looks like this:
Select Allow. You’ll have the option to customize your Slack app with a name and image.
Select Finish. The green checkmarks confirm that you’ve linked your accounts correctly. Click Finished Linking.
Select the orange Save Endpoint button.
Give your project a name and Save API Project.
Great! You’ve just saved your first project. Autocode automatically sets up a project scaffold to save your project as an API endpoint, but it hasn’t been deployed.
This means your endpoints are not yet live and can’t respond to HTTP requests or events. To deploy your API to the cloud select Deploy API in the bottom-left of the file manager.
🚀 Congrats! Your App is Live
Test your Slack app by joining or leaving any channel in your workspace. If you’ve set everything up properly you should receive a warm welcome from your Slack app.
Bonus: Use Block Kit Builder to Customize your Message
It’s time to get creative and add your personality to your Slack app with Block Kit Builder.
Block Kit Builder is Slack’s visual prototyping tool that enables Makers to create rich and interactive message designs without having to write code. Makers can choose from pre-built templates and edit the code or use building components. Once a design is ready, copy and paste the JSON into the blocks section of your project on Autocode.
Access my template design by hovering over and copying the URL in this link. Paste it in a new tab’s address bar. You should see a template that looks like this:
Select and copy only the objects inside the brackets [].
Set the objects as the value for theblocks key by pasting the code directly onto Autocode’s interface as I have done below:
Select Save Endpoint and Deploy buttons to push your changes live 🚀
When you test your app you should see the updated welcome message.
🙌🏼 And That's it!
You now have all the tools you need to build your unique onboarding experience for new users in your workspace!
I hope this article has been helpful showing you how easy it is to create a private Slack app greeter using Autocode on Standard Library.
If there’s anything in the article you notice could be improved let me know!
I would love for you to comment here, e-mail me at Janeth [at] stdlib [dot] com, or follow Standard Library on Twitter, @StandardLibrary. Let me know if you’ve built anything exciting that you would like Standard Library team to feature or share — I’d love to help!