タイトルは言いたいだけです！！！
最近の話
- グプタ使い @199338miya がモリモリコードを書いてくるので、この才能伸ばさねば。ってことで、GitHubアカウントを提供して、レビューしやすいようにした
- メインはGASですが、知らない使い方やクラスとかわんさかでてきてとても勉強になってた
- これはまた別の話で、実験的にやりたい施策があって、プロダクトへ追加開発すると色々時間かかりそうだなって思ってた
- その中で、レビューからの学びと、Gemini使ってGASでAPIとか組めないか検討してみた
- 半日ぐらいかけてやったら簡単にできたのでこれは便利だ！！！ってなった話をする
GASでできること
グプタ使いのGASをレビューしてわかったこと
- HTTP GET/POSTを喋れるAPIを用意できる
- doGet/doPostなる関数がある
- HtmlOutputで返すと、Webページが作成できる
- HtmlServiceを使う
- シートのロックも取れる
- LockServiceを使う
- キャッシュも作れる
- CacheServiceを使う
- シート操作はもちろんできる
- シートをテーブルとみなして、操作できる（これはもちろん知られていると思う）
- 環境変数を秘匿して設定できる
- PropertiesServiceを使う
- 外部APIを叩く
- UrlFetchAppを使う
- ロギング
- Loggerを使う
とまぁ色々とできることがわかりました。まとめると
- APIを簡易に用意できる
- そんなに複雑なデータ構造や、シートを大量に利用するデータでなければ、シートを簡易データベースとして利用できる
- 排他処理やキャッシュが利用できる
- JSONや、HTMLをレスポンスで扱える
- ロギングもできる
- 無料で利用できる（Workspaceは有料だけど）
ということで、使い捨て前提の簡易なWebフレームワークとして最強では・・・？って思いました
制限はあるので注意
試してみる（Gemini + GAS）
自分が実際に試した流れをメモする
要件
- とあるサイトにのせる動的なUIがほしい
- そのサイトはJavaScriptが動くことはわかっている
- UIでボタンおしたら、外部APIへリクエストして結果を加工して表示するUIを作ってほしい
GeminiのCanvasを利用する
GeminiのCanvasで、UIやWebサイトについて壁打ちしてデザインを作り込んでもらいます。Canvasを利用すると、ある程度は動作するものでUIの壁打ちができるので、とても重宝してる
Tailwind CSSで作られたUIができるので、環境によってはすぐ適応できるかもですが、僕はバニラに書き直してもらいました
（というか検証用に試しただけなのにすごいなまじで！！）
外部APIを用意する
GASで用意しました。doPostでリクエストを受け取って、シートを参照し、外部APIへリクエストして結果を加工して返すようにしました
もちろんこれもGeminiに依頼したものです
// --- 設定 ---
const SHEET_NAME = 'シート名';
// doPostに変更
function doPost(e) {
try {
// POSTデータをJSONとしてパース
const params = JSON.parse(e.postData.contents);
// ...
if (count !== null) {
return createResponse(200, { ... });
} else {
return createResponse(404, { error: '...' });
}
} catch (err) {
return createResponse(500, { error: err.toString() });
}
}
保存したら、デプロイしてAPIのURLを発行します
UIとつなぎこみ
発行されたURLをUIにつなぎこみます。動作したらおｋ！！
かかった時間
- 動作確認含めたら半日（載せるサイトでの格闘がほとんど）だけど、ソースコード単体での動作確認は1時間ぐらい！すごい！
雑感
- 簡単で良い。実験はこれでやって、うまくいったらプロダクトに組み込むってのがいいなって思った
- 最初からやれ。って話もあるとは思うが、うまくいくかどうかわからないのに組んだ屍の経験が多いので、メインに組まず、その前に実験できるのであればいいなーって僕自身は考えています
- ただし、制限もあるので、それ込みで検討して決めるといいんじゃないかな
以上です！