[IBM Watson Online Meetup - April 17, 2019] In this interactive workshop, Tomomi Imura from Slack and David Nugent from IBM Developer SF City Team will walk you through building a bot using Slack's API and Block Kit, and making it smarter using IBM Watson. Tomomi will walk you through how to build a Slack bot with Slack API using Node SDK, and improve the bot with Slack’s new Block Kit Builder. She will also cover how to make the bot smarter using IBM Watson. This session uses Node.js, however, you should be able to follow if you have a general understanding in any programming language. All you need is a Chrome browser to try out the sample code.

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

17. chat.postMessage

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

21. {
"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
}

23. ●
●
●

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

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

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

42. 2
1

44. 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

45. ●
●
●
●

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

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

51. 1
2

52. 3

53. 1
2

54. 3

55. .env
4

56. 2
1

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

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

60.
1 2
3
4

62. 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:` }
)
}
});

63. /invite @bot_name

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

66. 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

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

71. 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

73. 2
3
1

74. 1
2

75. 1

76. 2
1
3
4

77. 1

78. 2
1

79. 1

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

81. 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
});

82. 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!