きり丸の技術日記

技術検証したり、資格等をここに残していきます。

SlackAppをセットアップした時の手順

SlackAppをセットアップした時の手順といいつつ、正確には現在所属しているコミュニティのSlackAppをローカルにセットアップした時の手順を書きます。

なので、アプリを1から作成したわけではないので、いくつか手順を飛ばしているところはあると思います。

自分が改めて1から作ったときは、アップデートしようとは思います。

セットアップしたアプリ

Cem太郎

使用技術

  • Bolt
    • Slack API を使いやすくするための Node.js フレームワーク
      今回は、1から作ったわけではないが、メソッド名が非常にわかりやすかったので、横から参戦しやすい。
  • ngrok
    • ローカルで立ち上げたサーバーを外部に公開することができる。
      それで、SlackApp 等の動作確認を一々デプロイせずに確認できる。
      httpsでも公開できるので、非常に便利。
  • Firestore
    • NoSQL の Database 。
      無料で使えて便利。

セットアップ手順

  1. ngrokを使えるようにする
    1. ngrokにSign upする。
      サインアップページ
    2. ログイン後のページに、セットアップの方法がすべて載っているので、ngrokを起動させる。
      f:id:nainaistar:20200406224446p:plain
  2. Firestoreを登録する
    1. Firestoreの新しいプロジェクトを作成する
    2. 新しいプロジェクトにて、Firestoreを登録する
    3. サービスアカウントキーを作成する
  3. SlackAppを登録する。
    1. Appページにアクセスする
    2. Appの名前と使用するワークスペースを選択する。
      f:id:nainaistar:20200406224944p:plain
  4. 登録後に、クライアントのトークンが発行されるので、使用する。
    1. Signing Secretを使用する
      f:id:nainaistar:20200406225020p:plain
  5. サイドメニューの「Interactivity & Shortcuts」にて、モーダルを受け取るURLを指定する
    1. f:id:nainaistar:20200406225140p:plain
  6. サイドメニューの「OAuth & Permissions」にて、アプリに権限を付与する。
    1. Scopesの"Add an OAuth"を選択して、必要な権限を付与する。
      f:id:nainaistar:20200406225228p:plain
    2. 選択後、ページ上部のボタンが活性化するので、クリックする。
  7. 付与後、アクセストークンが払い出されるので、それを使用する。
    1. 今回は、Bot User OAuth Access Tokenを使用。
      f:id:nainaistar:20200406231444p:plain
  8. Slashコマンドを登録する。
    1. 登録するURLはngrokのURL + Boltで指定したエンドポイント
      f:id:nainaistar:20200406231650p:plain
  9. Signing Secret と Bot User OAuth Access TokenをBoltに使用するようにする
  10. 指定のチャンネルにアプリを配備する
    1. 歯車を選択する。
      f:id:nainaistar:20200406224558p:plain
    2. アプリを追加する
      f:id:nainaistar:20200406224606p:plain
    3. 今回作成したアプリを選択する
      f:id:nainaistar:20200406224630p:plain
  11. 以降はBoltの開発を行う。

おわりに

なお、ここまでまとめておいてなんだが、日本語の公式ドキュメントを最初から読めばかなり簡単だった。
Boltのヘルプから追っていったので、Slack App Apiのドキュメントに気づくことはできなかった。

必要なヘルプの見つけ方とかも、今後身に着けていきたい。
ここを読めば間違いなくわかる、っていうのがあればいいけど、それがわからなくて斜め読みした結果何も分からなくて時間かかってるのは本当に良くない。

公式ドキュメント

https://api.slack.com/lang/ja-jp/hello-world-bolt

セットアップしたアプリの開発ガイド

https://github.com/challenge-every-month/cem-app/wiki/%E9%96%8B%E7%99%BA%E3%82%AC%E3%82%A4%E3%83%89