![Building a Slack Chat Bot](https://static.frontendmasters.com/assets/courses/2023-08-25-chat-apis/thumb.webp)
Check out a free preview of the full Building a Slack Chat Bot course
The "Project Overview" Lesson is part of the full, Building a Slack Chat Bot course featured in this preview video. Here's what you'd learn in this lesson:
Jason walks through the accounts and tooling required for the course. GitHub, Slack, Notion, and Netlify accounts will be required to complete the course, along with Node version 16 and the Netlify CLI. The free tier of each platform is all that is required.
Transcript from the "Project Overview" Lesson
[00:00:00]
>> What we're gonna build today is we're gonna build a custom bot for slack. That custom bot is going to feature a slash command, which will allow someone to say I have a request and that that request is going to take user input and save that user input to notion.
[00:00:16]
We're also gonna have a context shortcut so the little three dots on a message. Where you can drop that down and then click a process reminder so that the bot will tell somebody like, hey, this looks like it's a request. If you want us to measure this, you've got to put it into the request form, here's the slash command to make that happen.
[00:00:33]
And then we wanna set up a weekly reminder for the team, for those incoming tasks for anything that hasn't been handled. We wanna make sure that we're letting people know like, hey, you've got requests in your queue don't drop those, because this is the other part. When you put a process in place, you have to adhere to that process unflinchingly as a team, or else everybody else in the company learns that your process is flaky.
[00:00:56]
And people won't use flaky processes, this is, we've seen this in tech, we've seen this in interpersonal communication and all over the place. If something is inconsistently applied, you stop trusting it, and that means you're less likely to do it. So as a team, when you put a process in place, you need to make sure it's a process you can 100% follow.
[00:01:16]
And that's why things like having a weekly reminder are really useful because you can see, here are the tasks that we haven't handled. You can go handle them right away as part of your weekly standup meeting or a weekly triage session or whatever it is where you go and make sure that everything has been evaluated.
[00:01:32]
You've asked questions if something needs clarification, assigned it back to the person who requested it. You've assigned it to a team member if it's something that's ready to be worked on, or you've said, this isn't something we can handle if it's outside of what you can prioritize right now.
[00:01:44]
But in any case, you are actually going in and prioritizing these things because that builds trust in your process. People know that if they put something into the slash command, that they will get a response in a reasonable timeframe from your team. So how we're gonna build that is we are gonna, the biggest part is we're gonna set up a live tunnel so that we can test locally.
[00:02:04]
This is one of the things that gets really challenging when you start building with third party tools that are, you know, Slack bots and other types of commands that rely on a live service. When you're developing locally, you don't have a live URL that you can put into these services, which often means that what you're gonna end up doing is having to deploy your command.
[00:02:24]
And have it up on a production URL for testing which makes it so slow and so frustrating, so instead what we're gonna do is we're gonna use a live tunneling service. That will allow us to keep up a local development environment running, but also give it a live URL so that we can test as we go.
[00:02:41]
We're gonna use serverless functions to power our command so that we can keep it free. Our bot does not need to be constantly running. Our bot is all based on incoming requests. So you're gonna run a slash command which says, hey bot, that'll wake the bot up. You've got the cron job, which is gonna be running on a regular schedule, so that'll wake the bot up, and each of these things is something that is on a like a poll basis.
[00:03:05]
We don't need the on a push basis, sorry. We don't need the command to be listening or reading every message or anything like that, it's so we'll use a serverless function, keep it free. Cron jobs are gonna be used to handle our weekly reminders and, this is gonna be based on a few accounts so the first thing is we're gonna be working from a GitHub repo.
[00:03:25]
So you'll need a GitHub account if you wanna push and deploy this we are going to be working in Slack today so you'll need a Slack account with a workspace. You can create one of these for free At slack.com and you'll just need admin access. So if you have admin access to a Slack account you are welcome to create a test channel and work in there with no other friends so you're not you know being noisy to your team.
[00:03:49]
Or if you wanna be sure that you are not disrupting your team, just create a new workspace and work in there first and then you can port this bot, to any workspace that you want to use it in. You're gonna be using Notion, so you wanna have a Notion account and a Notion workspace that has API access, so somewhere where you're an admin.
[00:04:10]
We're gonna be creating one database in it that we read and write from, so you'll just need the ability to create a bot that can do that. We're gonna be using Netlify for the serverless functions for the live tunnel and for the Cron jobs, so to follow along with this tutorial, you're gonna want a Netlify account, it's free.
[00:04:27]
Again, everything that we're using today is gonna be on free tier, so no paid accounts or anything. This account is gonna be how we deploy things, how we set up the live tunnel. You could use something like ngrok, but it's a lot of setup and it's a little more handson than using a Netlify dev command, so that's why I went with Netlify.
[00:04:50]
Again, you could use ngrok and then any serverless functions provider that you wish, this is not a workshop that's like tied to this specific account. This is just the way that I found that is the fastest and least painful to get things set up. The free tier of these services are gonna be all you need, again, just as a reminder, tools that you gonna need, you gonna need git on your computer.
[00:05:13]
You gonna need Node v16 higher, the Netlify CLI is how we're gonna set up that live tunnel, so y'all gonna need that. You'll need permission to clone repos and run third-party code to your computer before you get started, make sure that you have permission to clone, and push to GitHub repos.
[00:05:38]
So a few things that I'll be using that aren't required for this but just to give some context on on the stack that I use. VS code is what I'll be using is both my code editor and as my terminal I like it, you can use whatever you want.
[00:05:52]
GitHub CLI, I use this for managing repos, it's delightful to use, i love it, you don't need it, but that's what I'll be using whenever you see the GH command, that's the GitHub CLI. And again, these are my preferences they're not requirements you can work with or without these of you if you wish.
[00:06:11]
Some assume knowledge, what I assume you're gonna know as I go through this workshop, some intermediate knowledge of JavaScript, so, nothing super in-depth. This isn't gonna be like an algorithms whiteboard interview or anything. But what I will be assuming is that you understand the basic grammar of the language, you know, how to set up, how to create variables, how to create functions, how to do a loop and things like that.
[00:06:33]
It just, we won't do like an intro to JavaScript as part of this workshop. We'll be sending and receiving data via API, and I'm not gonna go deep into the specifics of that, so we'll be using the Fetch API. If you've never used the Fetch API, the docs are on the Mozilla developer network, the MDN docs, so go check those out, but you won't need the depth of it.
[00:06:55]
You just need to know what I'm doing and I will walk through that. Again, if you have questions, please do ask. We'll be running some commands in the terminal, and this is, you can just copy paste what I do. But I am gonna assume that you are aware of where your terminal is and how to run a command in it.
[00:07:12]
Basic awareness of TypeScript, we're gonna be using types for autocomplete today. I've already written all of the types that you're gonna need, and they're in the starter repo that I'll show in a minute, so you don't need to write TypeScript really. We might add a couple types to functions and things as we go, but we're not gonna be setting up types or interfaces or anything like that.
[00:07:33]
So you don't need to know how to write TypeScript as much as you just need to know That TypeScript exists and that we're using it a little bit. And yeah, again, you don't need to be a pro for any of these things. You are welcome to ask questions and let me know if something doesn't make sense and I'll try to explain it.
[00:07:52]
But these are the things that I'm kind of coming in with a baseline assumption of.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops