1.
https://source.opennews.org/articles/slack-buttons/

2.
chat.postMessage

3.
{
"channel": "CBADA55JP",
"attachments": [...]
}

4.
{
"mrkdwn_in": ["text"],
"color": "#36a64f",
"pretext": "Optional pre-text that appears above the attachment block",
"author_name": "author_name",
"author_link": "http://flickr.com/bobby/",
"author_icon": "https://placeimg.com/16/16/people",
"title": "title",
"title_link": "https://api.slack.com/",
"text": "Optional `text` that appears within the attachment",
"fields": [
{
"title": "A field's title",
"value": "This field's value",
"short": false
}...],
"thumb_url": "http://placekitten.com/g/200/200",
"footer": "footer",
"footer_icon": "https://example.com/default_application_icon.png",
"ts": 123456789
}

5.
●
●
●

6.
[
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "Hello World!"
}
},
{
"type": "divider"
}
]

7.
[
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "Hello World!"
}
},
{
"type": "divider"
}
"accessory": {
...
}
]

8.
[
...
"accessory": {
"type": "button",
"text": {
"type": "plain_text",
"text": "Farmhouse",
"emoji": true
},
"value": "click_me_123"
}
]

9.
2
1

10.
User post a message,
“Hi @help_bot”
Sends payload to
request URL
chat.postMessage
Post a
message
Hi here’s some info!
Hi @help_bot
app_mention
event is triggered

11.
●
●
●
●

12.
This link will create a new
repo just for you, with the
code template!

13.
Create a new app from
2
3
1
4
5
1
2
3
4
５

14.
1
2

15.
3

16.
1
2

17.
3

18.
.env
4

19.
2
1

20.
Click “Show” to
reveal the secret.
Copy then paste in
.env
.env
1
2

21.
2
3
1
https://puzzling-dinner.glitch.me/slack/events

22.
1 2
3
4

23.
app_mention
// Greeting any user mentions your bot, @greet_bot
slackEvents.on('app_mention', (message) => {
// When the message is a plain messages and contain 'hi' (case insensitive)
if (/hi/i.test(message.text))) {
// Respond to the message back in the same channel
slack.chat.postMessage(
{ channel: message.channel, text: `Hello <@${message.user}>! :wave:` }
)
}
});

24.
/invite @bot_name

25.
2
1
http://api.slack.com/tools/block-kit-builder

26.
const messageBlocks = [
{
"type": "section",
"text": {
"text": "Hello, welcome to the *Workspace X*nHere's a list of info you are probably looking for:"
}
},
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "<https://example.com|*Cafeteria*> n Building 1nSouth-East cornernOpen: 8am - 5pm"
},
"accessory": {
"type": "image",
"image_url": "https://upload.wikimedia.org/wikipedia/commons/3/3b/BHS-Cafeteria.jpg",
"alt_text": "cafeteria"
}
},
// ...
]
n = new line

27.
if(/hi/i.test(message.text)) {
slack.chat.postMessage(...);
}
Hi
I need help
Guide me
Show me the
floor map

28.
Sends payload to
request URL
chat.postMessage
Post message
Hi here’s some info!
Show me office
directory!
Extract user-sent
message & pass
Process & return
User post a message,
“Hi @help_bot”
app_mention
event is triggered

29.
2
3
1

30.
1
2

31.
1

32.
2
1
3
4

33.
1

34.
2
1

35.
1

36.
const Assistant = require('watson-developer-cloud/assistant/v1');

37.
const Assistant = require('watson-developer-cloud/assistant/v1');
const assistant = new Assistant({
url: 'https://gateway.watsonplatform.net/assistant/api',
version: '2019-04-04',
iam_apikey: process.env.WATSON_API_KEY
});

38.
slackEvents.on('app_mention', (message) => {
const params = {
workspace_id: process.env.WATSON_WORKSPACE_ID,
input: { text: message.text }
};
assistant.message(params, (err, result, response) => {
slack.chat.postMessage({
channel: message.channel,
text: result.output.text[0],
}).catch(console.error);
});
});
Psssst, let’s forget about
BlockKit for now, and post
a simple text!