1K Views
January 26, 25
スライド概要
以下DocswellのAI要約機能に書かせたらとくに問題なかったのでほぼそのまま採用した内容です(タグ生成も)↓
Google Apps Scriptを使って、学校のICT支援におけるさまざまな課題を解決する方法について紹介しています。特に、情報技術によって解決できる問題であっても、GIGAスクール構想に沿ったICT支援の環境下においてはプログラミング・開発環境などのソースがない中、アプリケーション開発の可能性を探ります。また、Google Apps Scriptの特徴や利点と可能性に触れつつ、ICT支援員として実際に作成したアプリの例を通じて、教育現場での活用方法を具体的に示しています。
Google Apps Scriptで 乗り越える ギリギリ環境・学校ICT支援編 2025/01/25 Niigata5分Tech #15 With PHP勉強会in新潟
自己紹介 近影 - 新潟市中央区 最近 地域猫に撫でることを許さ れた(うれしい) - PHPの話はしません >< - 初登壇です 小学校のICT支援員やっていま す
ICT支援員
学校のICT支援まわり 2020年くらいから公立学校にタブレット端末が一人一台配布された - 「GIGAスクール」で検索 新潟市はiPad 授業もタブレットを使う アプリの使用や端末操作の補助、提案とか研修 新潟市におけるここらへんの仕様の概要はガイドラインで公開されている https://niigata-giga.info/wp-content/uploads/2024/03/GIGAschoolGideline_ver5.pdf
プログラミングで解決するための環境・リソースがない 「こういうの[あったらいい|できる?]」 → できらぁ! 開発すればいいがサーバーなどの資源がない アプリ作ればいいが環境も権限もない セキュリティ範囲・認証関係などどこまでカバーできるのかよくわからない
そこで Google Apps Script
おさらい Google Apps Script *略称で GAS がよく使われますがここでは(Google)Apps Scriptで呼称します VBAみたいなもん(?) GoogleアカウントがあればOK 個人でもWorkspaceでも - 教育機関の場合はGoogle系サービス使ってるならまず間違いなくGoogle Workspace for Educationを 導入しているはず オンラインエディタがある JSで書ける Webアプリを作れる(←!!!!) https://developers.google.com/apps-script/guides/web 自分のICT支援業務では実質的に自由にプログラミング・開発できる唯一の環境
Google Apps ScriptのWebアプリ デプロイして共有・公開 - 超簡易的なAPIサーバ代わりにも使える が、癖も罠もかなりある *まともなREST APIサーバとしてみなすにはそれなりの注意が必要 - ルーティングとか一応できるがパースは自力でやる POSTするとリダイレクトされる、リダイレクト先ではGETになる など - curlでいうと curl -d ‘{...}’ -L <url> 、でいけます フロントエンドコードを返せる - 対応しているのはhtmlのみ → SPAでJSもCSSもまとめればOK - こちらも癖も罠もかなりある。多重iframeで囲まれるなど Google SheetsをDBとみなすシチュが多そう(Excelのノリ) Google DocumentやSheets同様、公開範囲の設定で組織内のみにできる
気になる環境構築 詳細は省略!(学校環境だとできるわけがないので) 要は1枚のhtmlファイルを作れればいい - - ローカルで書くときはclaspというCLIツールがある - https://developers.google.com/apps-script/guides/clasp - Apps Scriptのclone, push, deployとかができる 型定義ファイルがある。TypeScriptで書くとうれしい - - https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/google-apps-script SPAを作るノリでやる - viteでやるなら https://github.com/richardtallent/vite-plugin-singlefile と https://github.com/mahaker/esbuild-gas-plugin - クライアント側からApps Scriptのメソッドを呼ぶ`google.script.run`を簡単にしてくれるラッ パーもいれる https://github.com/enuchi/gas-client
作ってきたもの
図書室の蔵書検索 Spreadsheetに本のリストを書 いて全件検索 簡易的なものだが意外と児童にウ ケた *初めてVue書いた
健康観察用のフォーム Google Formsを使った例をよく見かけるが、用途的に は取り回しが悪い - 選択肢の結果を使って動的にフィルタリングとかインク リメンタルサーチとかできない - 複数投稿が一度にできない - データ(ラベル=値)がFormsに直書きなので柔軟性に 欠ける、編集しづらい - SpreadsheetとFormsの両方を管理するのが面倒 フォーム部分はWebアプリで自作すればOK *初めてReact書いた react-hook-form 超偉大
授業中に生徒の進捗率とかを管理するようなもの Spreadsheetの各シートを生徒ひとりひとりが編集するような使い方はよくある 困っている生徒がいたらみんなで助けあおう~ カスタムメニュー内でhtml表示できるのでデプロイすら不要
ほか - 別システムで発行されてるアカウントデータの表示 - - 当番表みたいなやつ 問診票みたいなやつ ゲーム - - Basic認証的な感じ など 去年 Workspace管理画面でApps Scriptの制御が追加された(Google Workspace Updates: Google Workspace Updates Weekly Recap - August 2, 2024)のでほどほどにしないと塞がれる
まとめと感想 Google Apps ScriptがあればWebアプリが作れる... リソースのまったくない環境では神のような機能 初めて書いたReact/TypeScriptはApps Scriptで動かすものでした 学習にも良いかも Spreadsheetはどこでも大活躍
ありがとう Google Apps Script
おしまい