LoginSignup
8
6

More than 5 years have passed since last update.

QiitaのOrganization一覧をGoogleスプレッドシート経由のWebスクレイピングしてSlackに毎日通知

Last updated at Posted at 2018-04-06

背景

  • エンジニアチーム全体にQiitaへの投稿を促す施策を考えてた
  • そうこうしているうちに、みんなが投稿しまくったら、QiitaのOrganization一覧ページで1位を獲得:muscle_tone3:

image.png

  • 沸き立つエンジニア。

このモチベーションを続けさせたい!

ということで、

  • Webサービスと同じで、モニタリングしていく(見える化していく)ことで現在地がわかる

毎日QiitaのOrganization一覧ページの上位20位までをSlackに通知して見える化だ!!

思い立ったが吉日、早速作業に取り掛かる。

最近、Googleスプレッドシート×Google Apps Script(GAS)の組み合わせがお気に入りなので、スクレイピングできないかなーと思って調べてみた。

第一関門は、Webページの要素をGoogleスプレッドシートに落とすこと!!

Googleスプレッドシートの編集

そう、importxml 関数を使えば、スクレイピングもできちゃいます。

  • A2
    • 1
  • B2
    • =importxml("https://qiita.com/organizations","//*[@id='main']/div/div/div[1]/ul/li["&$A2&"]/div[2]/h2/a")
  • C2
    • =importxml("https://qiita.com/organizations","//*[@id='main']/div/div/div[1]/ul/li["&$A2&"]/div[2]/h2/a/@href")
  • D2
    • ="https://qiita.com"&C2&"/activities"

importxml 関数の説明は この記事 を参考にした。

上記の数式を入力すると、
スプレッドシートに表示されのは下記のような表となる。

rank company_name href url
1 ユアマイスター株式会社 /organizations/yourmystar https://qiita.com/organizations/yourmystar/activities
2 株式会社グロービス /organizations/globis https://qiita.com/organizations/globis/activities
3 Quipper, Ltd. /organizations/quipper https://qiita.com/organizations/quipper/activities
4 ランサーズ株式会社 /organizations/lancers https://qiita.com/organizations/lancers/activities
5 ハンズラボ株式会社 /organizations/hands-lab https://qiita.com/organizations/hands-lab/activities
6 TIS株式会社 /organizations/tis https://qiita.com/organizations/tis/activities
7 ヤフー株式会社 /organizations/yahoo-japan-corp https://qiita.com/organizations/yahoo-japan-corp/activities
8 リコーITソリューションズ株式会社 /organizations/ayudante https://qiita.com/organizations/ayudante/activities
9 アユダンテ株式会社 /organizations/jrits https://qiita.com/organizations/jrits/activities
10 株式会社オープンロジ /organizations/shouldbee https://qiita.com/organizations/shouldbee/activities
11 ShouldBee /organizations/leverages https://qiita.com/organizations/leverages/activities
12 レバレジーズ株式会社 /organizations/gamewith https://qiita.com/organizations/gamewith/activities
13 株式会社GameWith /organizations/zlab https://qiita.com/organizations/zlab/activities
14 ゼットラボ株式会社 /organizations/miraito-inc https://qiita.com/organizations/miraito-inc/activities
15 株式会社ミライトデザイン /organizations/kronos-jp https://qiita.com/organizations/kronos-jp/activities
16 株式会社クロノス /organizations/yumemi https://qiita.com/organizations/yumemi/activities
17 株式会社ゆめみ /organizations/primebrains https://qiita.com/organizations/primebrains/activities
18 株式会社プライム・ブレインズ /organizations/rarejob https://qiita.com/organizations/rarejob/activities
19 株式会社 レアジョブ /organizations/openlogi https://qiita.com/organizations/openlogi/activities
20 株式会社ヴァル研究所 /organizations/digitalcubeinc https://qiita.com/organizations/digitalcubeinc/activities

そして、Googleスプレッドシートの内容を、Slackに通知

  1. Incoming WebHooksを有効にする
    https://slack.com/services/new/incoming-webhook

  2. Webhook URLをコピーしておく

  3. スプレッドシートの「ツール」>「スクリプトエディタ」を開く

  4. スクリプトエディタにソースコードを記載する&トリガーを設定する


var slackUrl = "https://hooks.slack.com/services/aaaaaaaa/bbbbbbbb/xxxxxxxxxxxxxxxxxxxxx"; // 手順2でコピーしたURL
var username = 'Qiita Organization一覧'; // Slack通知のユーザー名を上書き
var icon = ':qiita:'; // Slack通知のアイコン画像を上書き

function postSlack(payload){

  var options = {
    'contentType' : 'application/json',
    'method': 'POST',
    'payload': JSON.stringify(payload),
    'muteHttpExceptions' : true
  };

  var response = UrlFetchApp.fetch(slackUrl, options);

  return response;
}

function reportOrganization() {
  var ssId = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"; // スプレッドシートのURLに含まれてるID
  var spreadsheet = SpreadsheetApp.openById(ssId);
  var sheet = spreadsheet.getSheetByName("organization");

  var range = sheet.getRange(2, 1, sheet.getLastRow() - 1, 4);
  var values = range.getValues();

  var line = '';

  // values[i] は 1行目
  // values[i][0] は 1列目
  // values[i][1] は 2列目
  // values[i][2] は 3列目
  // values[i][3] は 4列目

  for(var i = 0;i<values.length;i++){
    values[i].splice(2, 1);
    line += values[i].join(" ") + "\n";    
  }

  var body = {
    "text" : line,
    "username" : username,
    "icon_emoji" : icon
  };

  var postSlackResponse = postSlack(body);
}

最後にGASを自動実行するトリガーを設定する

  1. 毎朝「時間主導型タイマー」を使って実行を設定

2018-04-06_15h48_40.png

以上で完了です。
時間が来たら、自動的にSlackに通知が入ります!

2018-04-06_15h45_00.png

毎日、20位以内に入るようにみんな更新してくれるかな~

エンジニアのみんなが楽しみながら、知識の定着や新領域の挑戦がしやすい環境を求めて、これからも色々試してみたいと思います!!

8
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
6