🎬 Episode 2: Slash Commands and Conceptual Design
Tags: node, automation
Published: 2023-09-02 11:52:50

### What's the Deal?

1. **Slash Commands**: These quick commands are the express lane of Slack bots. Hold onto your hats!
2. **Your First Slash Command**: We're making a slash command. You in?
4. **Coding Time**: We'll toss in a casual "Hi" to get the ball rolling.

---

### 1. Slash Commands: The How and Why

Previously we've built a system where we listen for a particular message and respond with a cat picture. Lets delve into something slightly more practical.

Interacting with users on Slack can be a total carnival, and that's what makes this gig so fun. Sure, you could make some fancy interactive window asking for names and such, but let's keep it simple. I don't want to click through endless modals when you could do everything with a one-liner. The fewer clicks, the better.

So, we're rolling with slash commands.


- **Help, Please**:  
```
/tasky help
```
  
- **Task Shenanigans**:  
```
/tasky create UniqueTaskName
/tasky remove UniqueTaskName
```
  
- **Assignee Juggling**:  
```
/tasky add-assignee UniqueTaskName @user1 @user2
/tasky remove-assignee UniqueTaskName @user1 @user2
```
  
- **Next Up**:  
```
/tasky next UniqueTaskName
```
---

### 2. Your First Slash Command

Take a minute, head back to Slack's settings, and whip up a slash command for your bot. It's like making an omelette but with less mess.

![Slash command](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/27f3k6834z8794b3sohf.jpg)

#### The Specs:

- **Command**: Ours is gonna be `/tasky`.
- **Request URL**: The same URL you already have up and running. `https://kumbaya-my-lord-kumbaya.serveo.net/slack/events`
- **Description**: It's optional, but don't you want people to know your bot's purpose?

![Configuration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7nq0650amsvqnw89m6q5.jpg)

**Make sure to tick to 'escape the channels and users' to interpret channels and users properly.**

#### Testing and Debugging

After reinstalling the app with the new settings, test the command `/tasky`. 

![error](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c4jjoofmwt85v3jtzkli.jpg)

If you see a timeout error, don't fret; it’s expected since we haven't set up the backend to handle this yet.

```
[ERROR]   An incoming event was not acknowledged within 3 seconds. Ensure that the ack() argument is called in a listener.
```

Also in slack:
```
/tasky failed with the error "operation_timeout"
```

---


### 3. Code Time

Now for the hands-on part. [Retrieve the codebase from].(https://github.com/mmehmetAliIzci/Tasky)

Checkout to particular commit via `git checkout 924262c` and `cd step-2`. 

At this stage, we've created a new `parseCommand` function that helps translate the slash commands to actionable logic. Right now, it's limited to a simple replies.

At this point, if you would run the bot and try to interact, you will have something similar like this:

![ugly response](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vpm7al4aesk6af43vxe9.gif)

We are one step closer but obviously this is quite ugly. To make the bot's replies more appealing, Slack provides a good guide to 'beautifying' your text output. You can go nuts. Check out [slack block kit building](https://api.slack.com/block-kit/building).


#### Make it a beauty

I still want to keep things simple but also help the users. Thus I’ve did some alterations to the responses. They are all stored in blocks. You can find the latest version from [here](https://github.com/mmehmetAliIzci/Tasky/tree/main/step-2):

If you run this code it should look something like this:

![beautey](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6piav9wb6h68g9govjyf.gif)

---

So there you have it, folks. You're one episode closer to becoming the office Slack bot guru. Stay tuned.