Upgrade to Pro — share decks privately, control downloads, hide ads and more …

エンジニアなので「技術」で仕事を効率化してみた ~Slack連携でチームの生産性が向上~ OCEM#2

エンジニアなので「技術」で仕事を効率化してみた ~Slack連携でチームの生産性が向上~ OCEM#2

エンジニアなので「技術」で仕事を効率化してみた
~Slack連携でチームの生産性が向上~

ONECOMPATH Engineer Meetup #2 (OCEM#2)
https://ocem.connpass.com/event/273110/

One compath

March 08, 2023
Tweet

More Decks by One compath

Other Decks in Programming

Transcript

  1. 株式会社ONE COMPATH(ワンコンパス)
    エンジニアなので「技術」

    で仕事を効率化してみた


    〜Slack連携でチームの生産性が向上〜


    View full-size slide

  2. ©ONE COMPATH CO., LTD. All rights reserved.
      自己紹介

    2
    ❖ どこの誰?

    ➢ 会社名 :株式会社ONE COMPATH

    ➢ 所属部署:プラットフォーム事業本部 CS・開発部 BIZ開発G

    ➢ 氏 名 :有村 淳一

    ❖ 何やってる人?

    ➢ 開発グループの技術マネージメント?しながら・・・

    ➢ toB向けスクラッチ案件の開発対応を並行で実施しながら・・・

    ➢ お客様への機能提案対応を営業と一緒に〜・・などなど

    ❖ 今まで何やってた?

    ➢ SIerとして色んな会社のWebシステムを開発

    ➢ 旧サイバーマップジャパンの時代からマピオンの各システムを開発

    ■ 法人開発・地図マピオン開発・国盗り開発・Shufoo開発


    View full-size slide

  3. ©ONE COMPATH CO., LTD. All rights reserved.
      今回のお題

    3
     皆さんご存知のSlack。

     メッセージやファイルのやりとりに使っているかと思います。


     どこの開発現場でもリソースが逼迫する中で

     エンジニアは開発に集中したい!余計な業務は簡略化したい!

     という意見を多数聞いておりましたので・・・


     今回は、エンジニアの「技術」によってどのようにして

     様々な仕事を「効率化」出来るか、その一部を紹介します。


    View full-size slide

  4. ©ONE COMPATH CO., LTD. All rights reserved.
      今回のお題

    4
    ❖ 効率化を目指した使用例

    ➢ オートスケールのサーバ台数を
    SlashCommandで変更

    ➢ システムアラート内容をSlackメッセージで通知

    ➢ TechNews系の内容のメールをSlackで情報共有

    ➢ Slackに記載した内容をメールにて送信

    ➢ Workflowを使って、情報を送信 ★


     


    View full-size slide

  5. ©ONE COMPATH CO., LTD. All rights reserved.
      事の経緯

    5
    Backlogを用意したけど、なかなか皆質問してくれないな〜

    もっと簡単に投稿してくれる仕組みないかしら・・・

    Slackからなら気軽に投稿してくれるんじゃない?

    ハチのこ弟さんに聞いてみよう!

    あ〜いいっすよ。

    考えてみますわ〜!

    企画Aさん

    企画Bさん


    View full-size slide

  6. ©ONE COMPATH CO., LTD. All rights reserved.
      事の経緯

    6
    Slackで投稿内容を入力

    Lambdaで

    Backlog登録

    チャンネルへ通知

    こんな感じかな・・・

    投稿入力の方法どうしよう・・・


    View full-size slide

  7. ©ONE COMPATH CO., LTD. All rights reserved.
      事の経緯

    7
    Slackに【Workflow Builder】

    ってのがあるな・・・

    これは楽そうだ!


    View full-size slide

  8. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    8
    ①SlackのメニューからTools -> Workflow Builderをクリック 


    View full-size slide

  9. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    9
    ①SlackのメニューからTools -> Workflow Builderをクリック 

    ②WorkflowBuilder画面の「Create」ボタンをクリック 


    View full-size slide

  10. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    10
    ①SlackのメニューからTools -> Workflow Builderをクリック 

    ③入力フォームの設定をして 

    「Publish」ボタンをクリック 

    ②WorkflowBuilder画面の「Create」ボタンをクリック 


    View full-size slide

  11. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    11
    ①SlackのメニューからTools -> Workflow Builderをクリック 

    ③入力フォームの設定をして 

    「Publish」ボタンをクリック 

    ④Slackのあるチャンネルの下記ボタンをクリック 

    ②WorkflowBuilder画面の「Create」ボタンをクリック 


    View full-size slide

  12. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    12
    ①SlackのメニューからTools -> Workflow Builderをクリック 

    ③入力フォームの設定をして 

    「Publish」ボタンをクリック 

    ④Slackのあるチャンネルの下記ボタンをクリック 

    ⑤メニューから「質問起票」をクリック 

    ②WorkflowBuilder画面の「Create」ボタンをクリック 


    View full-size slide

  13. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    13
    ①SlackのメニューからTools -> Workflow Builderをクリック 

    ②WorkflowBuilder画面の「Create」ボタンをクリック 

    ③入力フォームの設定をして 

    「Publish」ボタンをクリック 

    ④Slackのあるチャンネルの下記ボタンをクリック 

    ⑤メニューから「質問起票」をクリック 

    ⑥「質問起票」の入力画面が表示される 


    View full-size slide

  14. ©ONE COMPATH CO., LTD. All rights reserved.
      Workflow Builderを使ってみよう

    14
    ①SlackのメニューからTools -> Workflow Builderをクリック 

    ②WorkflowBuilder画面の「Create」ボタンをクリック 

    ③入力フォームの設定をして 

    「Publish」ボタンをクリック 

    ④Slackのあるチャンネルの下記ボタンをクリック 

    ⑤メニューから「質問起票」をクリック 

    ⑥「質問起票」の入力画面が表示される 

    ⑦「質問起票」にデータ入力すると、 

     Slackメッセージとして表示される 


    View full-size slide

  15. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack連携の仕組みを検討・・・

    15
    Slackのチャンネルに

    記載された内容を

    APIに送るには・・・


    View full-size slide

  16. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack連携の仕組みを検討・・・

    16
    SlackAppの記入イベントを

    トリガーにすれば・・・

    これはイケる!


    View full-size slide

  17. ©ONE COMPATH CO., LTD. All rights reserved. 17
      Slack Appを作ってみよう

    ①Slack Appを作ってみる 

     https://api.slack.com/apps  


    View full-size slide

  18. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack Appを作ってみよう

    18
    ②OAuth & Permissions設定 


     Scopes - Bot Token Scopesに 

     「channels:history」を追加する
    ※今回はSlackからメッセージをAPIに投げるまでの
    組み込みに必要な最低限の設定になります。 

    上記、channels:historyを選択しているのは、 

    後述するメッセージ送信するのに必要な権限なの
    で、この設定のみを追加しています

    View full-size slide

  19. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack Appを作ってみよう

    19
    ③Event Subscriptions設定……の前に、Lambda/ApiGatewayの設定を済ませておく!!! 



    
 ※詳細は割愛


    View full-size slide

  20. ©ONE COMPATH CO., LTD. All rights reserved. 20
      Slack Appを作ってみよう

    ③Event Subscriptions設定 


     Enable Eventsを「On」に変更 

     Request URLに対象のAPIを設定 

     Subscribe to bot eventsに 

     「message.channels」を追加する 


    View full-size slide

  21. ©ONE COMPATH CO., LTD. All rights reserved. 21
      Slack Appを作ってみよう

    ③Event Subscriptions設定(注意事項) 



    ※上記Request URLを設定すると、APIの認証が走ります。 

    詳細はコチラに記載されています 

    → https://api.slack.com/apis/connections/events-api 

    今回は認証だけサクッと終わらせるために、 

    こんなプログラムを別途準備しています。

    View full-size slide

  22. ©ONE COMPATH CO., LTD. All rights reserved. 22
      Slack Appを作ってみよう

    ④Appのインストール 


    View full-size slide

  23. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack Appを作ってみよう

    23
    ⑤SlackチャンネルへAppの追加 



    View full-size slide

  24. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack App連携を実行してみる・・・

    24
    Workflow使って

    チャンネルにメッセージを

    書いてみると・・・


    View full-size slide

  25. ©ONE COMPATH CO., LTD. All rights reserved.
      Slack App連携を実行してみる・・・

    25
    SlackAppと通してAPI

    実行のログが確認できた!

    ※CloudWatchLogsより抜粋 


    View full-size slide

  26. ©ONE COMPATH CO., LTD. All rights reserved.
      ここまで・・・

    26
    Slackで投稿内容を入力

    Lambdaで

    Backlog登録

    チャンネルへ通知

    投稿内容の入力〜API連携まで完了 

    backlogへのデータ登録/ 

    Slackチャンネルへ通知機能 

    のLambdaについて説明 


    View full-size slide

  27. ©ONE COMPATH CO., LTD. All rights reserved.
      Lambdaに機能を実装しよう

    27
    ①Backlog APIを利用時の前準備 



    IP:10.11.22.333 

    (例)

    IP:12.1.2.3

    (例)

    弊社利用のBacklogでは 

    特定IPでアクセス制限を実施 

    VPC設定を実装する権限付与

    AWSLambdaVPCAccessExecutionRole

    Lambdaで特定IPアドレスによる通信を

    行う場合のシステム構成図

    View full-size slide

  28. ©ONE COMPATH CO., LTD. All rights reserved.
      Lambdaに機能を実装しよう

    28
    ②Backlog APIを使った登録処理 




    ※API利用について詳細はコチラを参照 

    →https://developer.nulab.com/ja/docs/backlog/api/2
    /add-issue/#


    View full-size slide

  29. ©ONE COMPATH CO., LTD. All rights reserved.
      Lambdaに機能を実装しよう

    29
    ③Slack通知機能の前準備 


    
 ※2019年からSlackのカスタムインテグレーションによるWebhookを使うのが非推奨になっています!

     Activate Incoming Webhooks 

     を「On」に変更

    次スライドへ続く


    View full-size slide

  30. ©ONE COMPATH CO., LTD. All rights reserved.
      Lambdaに機能を実装しよう

    30
    ③Slack通知機能の前準備 



    前スライドから

    ※作成したURLは指定した 

    チャンネルのみ送信出来ます 


    View full-size slide

  31. ©ONE COMPATH CO., LTD. All rights reserved.
      Lambdaに機能を実装しよう

    31
    ④Slack通知処理




    View full-size slide

  32. ©ONE COMPATH CO., LTD. All rights reserved.
      おさらい・・・

    32
    Slackで投稿内容を入力

    Lambdaで

    Backlog登録

    チャンネルへ通知

    ◆SlackでWorkflowを使って投稿

    ◆SlackAppを連携してメッセージを送信

    ◆BacklogAPIを使って登録
    
 ◆SlackAPIを使って通知


    View full-size slide

  33. ©ONE COMPATH CO., LTD. All rights reserved.
      実際に動かしてみた・・・

    33
    ◆SlackでWorkflowを使って投稿

    ◆SlackAppを連携してメッセージを送信

    ◆BacklogAPIを使って登録
    
 ◆SlackAPIを使って通知


    View full-size slide

  34. ©ONE COMPATH CO., LTD. All rights reserved.
    便利な使い方は無限にあります。

    みなさんも色々とやりたいことを実現
    していきましょう!

     まとめ

    34
    ONE COMPATHでは、このような

    技術で効率化を実現するメンバーを募
    集しています!


    View full-size slide