やること

• 下記の GAS 側の実装の Issue の仕様の POST リクエストを行って、スケジュールを作成できるようにする。HTTP リクエストは http でも dio でも良いが、かんたんなハンズオンを意識してシンプルに実装すると良さそう
• POST リクエストが済んだあとは 取得 API を叩いて、スケジュール一覧を取得し直す

API のリクエスト・レスポンスの仕様が書かれた Issue

#20

開発方法などのREADMEやPR TEMPLATE、ISSUE TEMPLATEなどを整備する

• スケジュール登録機能
  • スケジュール追加画面から情報を入力し、追加ボタンを押すとスプレッドシートのレコードにスケジュールが登録される
  • 必要な画面
    • スケジュール追加画面　(top画面からFABをクリックしたら遷移) add_schedule_page.dart

• liffの作成とflutter webへの紐づけ(liff.init()の実施くらいまで)

• スケジュール更新機能
  • スケジュール編集画面からスプレッドシートに登録したスケジュールを更新することが出来る
  • 優先度低

外部ブラウザでもログインできるようにする

https://zenn.dev/tokku5552/books/flutter-web-liff-scheduler/viewer/6_prepare_ngrok#%E8%A3%9C%E8%B6%B3

スプレッドシートとの紐づけ

• スケジュール削除機能
  • スケジュール編集画面からスプレッドシートに登録したスケジュールを削除することが出来る
  • 優先度低

• 荒田さんに対応頂いている部分

やること

• UIが表示できる
  • トップ画面 (スケジュールをリスト表示)
  • 追加、更新、削除画面

未解決の事項

• GASとの連携部分

LINE チャネル作成(liffとの紐づけ)

OAMで自動応答メッセージを設定して、グループに追加したbotの応答メッセージからliffを起動できるようにする。

• mainブランチの保護
  • とりあえず1人以上approveとかで

やること

• 下記の GAS 側の実装の Issue の仕様の GET リクエストを行って、レスポンスを受け取れるようにする。HTTP リクエストは http でも dio でも良いが、かんたんなハンズオンを意識してシンプルに実装すると良さそう
• 下記の仕様の Schedule オブジェクトを定義する。freezed や json_serializable を使用しても良いし、かんたんなハンズオンを意識してそうしなくても良いかもしれない。fromJson, toJson を定義して、HTTP の GET の結果を List<Schedule> に方が付いて使えるようにする
• とりあえず ListView.builder と ListTile で良いのでそれらを一覧できるようにする

API のリクエスト・レスポンスの仕様が書かれた Issue

#18

• Firebase Hosting
  • Firebase PJとリポジトリを紐づける
  • デプロイはGitHub Actionsに載せておく

やること

• HTTP の GET のエンドポイントを仮の個人のスプレッドシートに作成してデプロイ、URL を明らかにしてクライアントの実装を担当する人がわかるようにする
• 下記の要件で GET API を実装する

仕様

クエリパラメータで roomId または groupId を送る。

GAS の API でそれらのどちらかを受け取って、それらの undefined ではない方が一致するスプレッドシート行を特定し、それらを下記の schedule オブジェクトのリストとして返す。

リクエスト

### roomId を送る場合
GET /path/to/get/api?roomId={roomId}

### groupId を送る場合
GET /path/to/get/api?roomId={roomId}

レスポンス

HTTP/1.1 200 OK
Content-Type: application/json; charset=utf-8

{
  "schedules": [
    {
     "scheduleId": "uuid または行番号？",
      "title": "スケジュールのタイトル",
      "createdAt": "2022-09-01 00:00:00",
      "dueDateTime": "2022-10-01 00:00:00",
      "isNotified": false
    },
    {
      // ... 省略
    }
  ]
}

• スケジュール確認機能
  • スプレッドシートのレコードを読み、カレンダーウィジェットにスケジュールを表示する
  • 必要な画面
    • 恐らくtop画面になる。

おそらくGitHub Actionsのactions/checkout@v2がnode12使っているっぽいので、v3にmigrateする

やること

• 発表の流れの大枠を作る
• 当日の役割

やること

• HTTP の POST のエンドポイントを仮の個人のスプレッドシートに作成してデプロイ、URL を明らかにしてクライアントの実装を担当する人がわかるようにする
• 下記の要件で POST API を実装する

仕様

クエリパラメータで roomId または groupId を送る。

GAS の API でそれらのどちらかを受け取って、それらの undefined ではない方が一致するスプレッドシート行を特定し、それらを下記の schedule オブジェクトのリストとして返す。

リクエスト

スケジュールのタイトルと締め切り日時をリクエストボディとして送ってもらう。

"type": "create" としているのは同じ GAS プロジェクトではひとつの POST のエンドポイントしか作れないので、スケジュールの更新や削除のメソッドも時間が許せば実装する可能性があるので、そのときに "type": "update" とか "type": "delete" とかで実装できるようにするため。

### スケジュールの登録
POST /path/to/post/api

{
  "type": "create",
  "schedule": {
    "title": "スケジュールのタイトル",
    "dueDateTime": "2022-10-01 00:00:00"
  }
}

レスポンス

作ったレスポンスが返ってくる。

HTTP/1.1 201 OK
Content-Type: application/json; charset=utf-8

{
  "schedule": {
   "scheduleId": "uuid または行番号？",
    "title": "スケジュールのタイトル",
    "createdAt": "2022-09-01 00:00:00",
    "dueDateTime": "2022-10-01 00:00:00",
    "isNotified": false
  }
}

やること

• スケジュール通知機能の実装
  • GASのイベントトリガー機能で指定した日時にbotが追加されたLINE グループにスケジュールを通知する
  • roomId or groupIdでpushMessageをつかってメッセージを送信する。
  • 一旦メッセージの文章や形式、チャネルシークレットの取得方法などはおまかせ

仕様

• 現状でのレコードのイメージ
  

ローカルで各々開発できるようにdotenvかなにか導入する

ローカルでのビルド時はうまく行っているので、Actions固有の問題ぽい

https://flutter-liff-scheduler.web.app/

構成図のポンチ絵を作成する

LINEグループ作成