Vue.jsについて調べてわかったこと
簡単な社内システムをGoogleAppsScriptでWebアプリケーションとして作成しようと考えました。ググってみたところ、GoogleAppsScript+Vue.jsで作るのがよさそうな記事をいくつか見つけました。
【Google Apps Script Webアプリ】Vue.jsを使って非同期にスプレッドシートを読み取りデータを更新する。
google-apps-scriptでvue-jsを使ってみる
GASとJavaScriptフレームワークVue.jsを使ってWebアプリを作成するための最初の一歩
GASでWebアプリケーションのサンプルをつくってみた
クライアントのjavascriptから、GASのスクリプトを実行し、戻り値のhtmlタグをそのままjQueryで書き換えるようなサンプルです。
GAS側のスクリプトで一生懸命、htmlタグの文字列を組み立ててます。
Google Apps ScriptでWebアプリケーション作成 その６
これをVue.jsで書き換えようと思って、Vue.jsを調べてみました。
Vue.jsとは
vue.jsについて調べました。
- JavaScript フレームワークの一つ
- 導入が簡単（JQueryと同じくscriptタグのみ）
- シンプルで学習コストが低い（AngularやReactに比べて）
- 高機能なシングルページアプリケーション（SPA）を構築することも可能
- 最新はVue 2.6（2系は2.7まで）
- Vue.js 3.0.0 betaリリース(正式版は2020年末ぐらい？)
勉強したyoutube
学習コストが低いっていっても、やはり独自のルールを理解しないとわからないですね。当たり前ですが。
どのフレームワークでも同じですが、将来、メンテンナンスするのは作成者じゃないことが多いのでなるべくシンプルに作成したいです。
レスポンスがJSONじゃなかった
自分がつくったサンプルのように、GAS側でhtmlタグを作成し、その値をそのまま書き換える場合は、Vue.jsを利用する意味がないことに気づきました。
Vue.jsが威力を発揮するのは、JSON形式で値を取得し、JSONの値でhtmlタグを書き換える処理を作るときですね。WEB APIのレスポンスはJSONベースのフォーマットが基本なので、Vue.jsが活かせそうです。ただし、他者が提供されているWEB APIを使用せずに、GAS側でhtmlタグをすべて生成するのであれば、JQueryのみでいいのかも。
まだ、理解不足のため引き続き調査中。