LINEを使って医学部の授業でクイズ大会をしてみた！【初心者】

### はじめに

毎年数回医学部の学生に授業をする機会があります.
みなさんは授業を聞くのは得意ですか？
私は苦手です. 
始まる前は興味あり！と思っていたような授業でも、ずっと聞いていると睡魔に襲われてしまいます.
今回症候学という症状からどんな病気かを考えるという授業の中で、自分と同じような学生さんを退屈させないために授業でクイズ大会をやってみました.

### 具体的な流れ

1. 学生さんに授業の初めに該当のLINEアカウントを友だち追加してもらう.
2. 問題を出す.
3. 解答をしながら、他の人の解答が前のスクリーンで見られる.
4. こちらは解答を見ながら、「正解がまだ出ていませんねー！」「ヒントは・・・です。」などコメント.
5. 大体の解答が出たところで解説.


### 使用したもの
・LINE
・Googleスプレッドシート
・Google Apps Script
![全体像Qiita用鑑別大会.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2653579/6b609c2f-eab3-d5dc-f26b-acac5b36a2e9.jpeg)
### 解答用のLINEアカウントの作成
[こちらを参考にしました.](https://qiita.com/cog1t0/items/0d121ee6d48a8c1634fc)
### スプレッドシートの準備
* 新規のスプレッドシートを作成し、"log", "main"の２シートを作る
* 拡張機能でGoogle Apps Script(GAS)を開く

### logシートに今どの列に書き込むか指定するための数字を準備
初めは１を入れておく
![スクリーンショット 2022-07-07 0.09.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2653579/6f788f47-42a8-424f-c1a2-291c3cdaff9a.png)


### 解答がどんどん下に書き込まれる
```Javascript
var lastRow = mainsheet
        .getRange(1, col)
        .getNextDataCell(SpreadsheetApp.Direction.DOWN)
        .getRow();
      mainsheet.getRange(lastRow + 1, col).setValue(usermessage);
```
getNextDataCell(SpreadsheetApp.Direction.DOWN)を使用しましたが、これだと既に２行埋まっていないと1001列目に書き込まれてしまうとのことだったので、1,2行目は「第一問」「答え」など適当に埋めておきました.

このコードだけでは同時送信の場合にどちらかの解答がスプレッドシート上に反映されない時がありましたが、今回はそれでも大きな問題はない（もう１度送信してもらえばよいだけ）ので、これだけにしました.

まずテストとして第一問、「今日のお昼ご飯何食べましたか？」の回答
![スクリーンショット 2022-07-06 23.54.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2653579/bf011a00-aba2-fa4a-c689-dbedccf66440.png)
トマトロワイヤルは謎のまま（笑）最近の若者の間で流行っているんだろうか。


### 次の問題になったら行を変更する
```Javascript
if (usermessage == "next") {
      col = col + 1;
      logsheet.getRange("A1").setValue(col);
      messages = [
        {
          type: "text",
          text: "次の問題に移ります。",
        },
      ];
    }
```
LINEで「next」と送信すれば書き込む列が変わります.


### 実際のコード


```Javascript
var CHANNEL_ACCESS_TOKEN ="あなたのチャンネルアクセストークン";
var line_endpoint = "https://api.line.me/v2/bot/message/reply";
const logsheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("log");
const mainsheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("main");
var col;
col = logsheet.getRange("A1").getValue();

function doPost(e) {
  var json = JSON.parse(e.postData.contents);
  var reply_token = json.events[0].replyToken;
  if (typeof reply_token === "undefined") {
    return;
  }
  if (json.events[0].type == "message") {
    const usermessage = json.events[0].message.text;
    if (usermessage == "next") {
      col = col + 1;
      logsheet.getRange("A1").setValue(col);
      messages = [
        {
          type: "text",
          text: "次の問題に移ります。" + col + "問目です。",
        },
      ];
    } else {
      var lastRow = mainsheet
        .getRange(1, col)
        .getNextDataCell(SpreadsheetApp.Direction.DOWN)
        .getRow();
      mainsheet.getRange(lastRow + 1, col).setValue(usermessage);
      messages = [
        {
          type: "text",
          text: "どんどん答えてください！",
        },
      ];
    }

    UrlFetchApp.fetch(line_endpoint, {
      headers: {
        "Content-Type": "application/json; charset=UTF-8",
        Authorization: "Bearer " + CHANNEL_ACCESS_TOKEN,
      },
      method: "post",
      payload: JSON.stringify({
        replyToken: reply_token,
        messages: messages,
      }),
    });
  }
  return ContentService.createTextOutput(
    JSON.stringify({ content: "post ok" })
  ).setMimeType(ContentService.MimeType.JSON);
}

```
### その他
学生が約１００人ほどいるので、１問につきスプレッドシート１列だと下の方がスクロールしないと見えないんじゃないか？という懸念があったため、実際の授業ではLINEアカウントを２つ作成しました（１つ目のアカウントはA列、２つ目のアカウントはB列に書き込み）.
（※その場合はnextに対する挙動をcol = col +2に変更が必要です.）
２つ目のGASは、.getActiveSpreadsheet()が使用できなかったので、下記に変更.
```Javascript
const mainsheet = SpreadsheetApp.openById("スプレッドシートのID").getSheetByName('main');
const logsheet = SpreadsheetApp.openById("スプレッドシートのID").getSheetByName('log')
```
スプレッドシートのIDは＊＊＊の部分
docs.google.com/spreadsheets/d/＊＊＊/edit#gid=0

### 学生さんの反応
楽しかった、またやってほしいという反応をいただき、嬉しく思いました☺️
![授業感想.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2653579/6913ba94-182f-920b-0ef4-54de07a74c04.png)


### 課題
* 同時送信で消滅してしまう問題の解決→
* どんな解答が多かったなど集計機能
* 正解が見た目で分かる機能もおもしろいかも？
* nextと送信して次の列にいく以外に方法はないか？