how to build a slack-hubot with js

23
Hubot scripting in Slack Juneyoung Oh I-ON Communications 2015.08.01

Upload: juneyoung-oh

Post on 07-Jan-2017

1.925 views

Category:

Engineering


5 download

TRANSCRIPT

Page 1: How to build a slack-hubot with js

Hubot scripting in Slack

Juneyoung OhI-ON Communications

2015.08.01

Page 2: How to build a slack-hubot with js

Index of Contents

Purpose of this PresentationInstall Hubot on OSX

Invite Hubot in Slack roomWriting custom script for Hubot (js)

Tips from personal experiences

CAUTION : I will do all this on OSX with Slack, Heroku.

Page 3: How to build a slack-hubot with js

Purpose of this presentationThis presentation for you :- Want to make fun bot in your slack community- Who knows little about javascript- Want to try something fun with js, but do not want to much time on

it

This presentation NOT for you :- Hardcore programmer who ought know everything running in

background- Who never heard of javascript (I am not going to talk about js

basic :<)- Want to write custom script for Hubot in coffee script. (There are

many examples for coffee on web, so go for it :D)

Page 4: How to build a slack-hubot with js

Installing Hubot on OSX

CAUTION : Things NOT going to mention in here, but you need to prepare for further steps.- Install node.js on your system- Install nvm (node version mananger) on your system

Official Hubot installation guide can be found here :https://hubot.github.com/docs/

This link could be more accurate but I am going to talk about errors I have met while following those steps.

Page 5: How to build a slack-hubot with js

Installing Hubot on OSXFirst, Install `hubot-generator` with `yo`.

Could get following errors. it just need some authority on your system.

Fix this with `sudo` command like :

Page 6: How to build a slack-hubot with js

Installing Hubot on OSXNow, make a directory for the bot

Move into project directory

Calling hubot!

You could see following on your screen

Page 7: How to build a slack-hubot with js

Installing Hubot on OSXIn Terminal, you should fill some fields to proceed.

[ Fields list ]- Owner : Bot Owner name, nothing special.- Bot name : Going to use this name to call this bot. i.e. If your bot name is

‘testbot’, than `testbot what is your name?`- Description : Nothing special.- Adapter : Adapters which could use this bot. default is ‘campfire’. However,

you can change this anytime by editing a file named ‘Procfile’

This are sample which I wrote for this presentation :D

Page 8: How to build a slack-hubot with js

Installing Hubot on OSXNow, talk about directories & Files.Can check with `ls` command. It should shows like follow :D

[File List]- Procfile : can edit ‘Adapter’ options here.- external-scripts.js : Additional hubot script. User Custom Script Name can be

found here.- READ.md : This file for git. If you using a service like ‘github’, This document

will be shows at first.- hubot-scripts.json : Additional hubot script. But these are specific. Details

could be found : https://www.npmjs.com/browse/keyword/hubot-scripts- scripts(d) : Put your custom script this directory. To use this script, you have to

specify the name on external-script.js- bin(d) : A directory which has hubot execution file.

Page 9: How to build a slack-hubot with js

Installing Hubot on OSXLet’s run this :D

For now, a prompt is all. However still hubot can do serveral commands.Type following command.

remember, this space for your ‘Botname’.

Simple command sample for you.

Now, Let’s connect this with Slack!

Page 10: How to build a slack-hubot with js

Invite Hubot in Slack roomLet’s make this bot work in slack :DBefore start …- I assume that you already have a slack account- I assume that you already install heroku tool-belt.- Official tutorial can be found : https://github.com/slackhq/hubot-slack

1. Let the bot knows our adapter is ‘slack’.Go to hubot project folder, and open this with `vi` command.It looks like this.

We need to edit this file. so press ‘a’ or ‘I’ key to switch to ‘insert mode’. check the left bottom of terminal and you will see…

Page 11: How to build a slack-hubot with js

Invite Hubot in Slack room2. Replace that line with follow. If you want to keep the original one, add ‘#’ to the front of the line, so computer consider that as a comment, not a command.

Than, press ‘esc’ key to manage mode and type ‘:wq’. ‘w’ means ‘write’ and ‘q’ means ‘quit’.

TIPS. In normal mode type ‘:set nu’. now, vi shows line number for you. This function is quite useful when handling long script.

Page 12: How to build a slack-hubot with js

Invite Hubot in Slack room3. Deploy this to Heroku. For further information for Heroku, visit the link : http://www.heroku.com

You will get following as result.

As you can see in the last line, Heroku internally uses git. So our further jobs should upload and synchronized with that git URL.In this case,https://git.heroku.com/testbotapp.git is my heroku git address.

Page 13: How to build a slack-hubot with js

Invite Hubot in Slack room4. Install Heroku redistogo addon. Hubot uses redis DB as its brain, so need to install this to Heroku.(do not need to install redis on your local.)

heroku addons:create (addon name) –app (your app name in Heroku)

green : Heroku command. orange : variablespurple : which could be skipped (If you have bunch of Heroku apps like me, need to point specific target application)

* You need to register ACCOUNT INFORMATION to use heroku addons, even though it is free. It is necessary.

Page 14: How to build a slack-hubot with js

Invite Hubot in Slack room5-1. Add configurations to Heroku. To service Slack, it needs to know HEROKU URL and HEROKU_SLACK_TOKEN.Let’s add.

Go to below URL:https://{your room}.slack.com/services/new/hubot

After input your bot’s name, get TOKEN from the page.(It is on the top of the page. Can not be missed)

Page 15: How to build a slack-hubot with js

Invite Hubot in Slack room5-2. Add configurations to Heroku. Add information from the Terminal.

HEROKU_URL can be found heroku.com page.In [Setting] tab, middle of the page [info] section.

Page 16: How to build a slack-hubot with js

Invite Hubot in Slack room6. Run your bot and meet it in your Slack. First, need to push our code to heroku. Than, run it!

If you already have other heroku app, need to some extra process.Move to top folder of your Project. Than type follow before push.

Now run our bot.

As a result, can find bot in slack. See [DIRECT MESSAGES] section.

Page 17: How to build a slack-hubot with js

Writing custom bot script (js)This pages for custom hubot scripting for javascript, NOT coffee script.

Basic : Write custom script under ‘scripts’ folder .

Page 18: How to build a slack-hubot with js

Writing custom bot script (js)After, writing script. Edit ‘hubot-scripts.json’ in top folder.Add your script name without extension.

Left side is my folder structure, and right is contents of hubot-scripts.json.

Page 19: How to build a slack-hubot with js

Writing custom bot script (js)Finally, use ‘add’, ‘commit’ and ‘push’ command.Than, ‘heroku open’.

And go to slack, what you can see …

Page 20: How to build a slack-hubot with js

Tips from personal expTips from my experiences.

1. Checking heroku logs.This will be quite useful, since there are no scripting guides for javascript. By doing this, can find more information about internal object like message, robot or adapter.

2. Could not use DOM Elements.Hubot script can not use ‘document’ Object. (XMLHttpRequest Object also could not found).

Page 21: How to build a slack-hubot with js

Tips from personal expTips from my experiences.

3. Use ajax with internal API.For instance, it looks like…

4. In slack, some of APIs are forbidden to bot.i.e. kick API can not be called by a bot. For more information, refer following URL : https://api.slack.com/methods

Page 22: How to build a slack-hubot with js

Tips from personal expTips from my experiences.

5. Refer coffee script codes.There are no documents for javascript. So if you use js, you have to look what original structure(coffee) is. Refer ‘src’ directory of hubot github.URL : https://github.com/github/hubot/tree/master/src

Just like coffee, some objects will be found in js version.i.e. message, brain, robot, user … Can check if you print those in console and read heroku logs.

Page 23: How to build a slack-hubot with js

Thanks!