コピー2018.03.25この前の記事で、GASのWebアプリにVue.jsを組み込んでみたことを紹介しました。Materialを導入し、よりリッチなUIをお手軽に実現する方法をご紹介したいと思います。Materialはその名の通り、Vue.jsでマテリアルデザインを簡単に導入できるライブラリです。マテリアルデザインはGoogleが提唱しているデザインのガイドラインです。様々なデバイスで、使いやすく、統一的なデザインを実現できるとのこと。Materialを使うための雛形コードを以下に示します。StartedのCDNを参考にしています。GASでの変更点は、metaタグの取り扱いです。GASのWebアプリではindex.htmlにmetaタグを書いても反映されないため、GAS側のGETリクエストに対するレスポンスを記述するところで「addMetaTag」しているところがポイントですね。これで、必要なmetaタグを定義します。大まかなレイアウト構成は以下図のようになります。Toolbar画面の上部に表示されるツールバーです。タイトルやちょっとしたメニューを配置するのに役立ちます。Drawerいわゆるサイドバーになる部分です。Materialの部品の中にある「list」でメニューを作ることができます。Contentメインコンテンツ部です。body部だけ書き出すと、以下のようになります。使いたくないタグは使わなくてもいいですが、Contentは必ず使うことになるのではないかと思います。自分への備忘録(オレオレチートシート?)のために、サンプルページを作りはじめました。作り途中ですが、公開します。Materialが動いているのを確認できると思います。Samplescript.google.com上記サイトに書いてある部品以外にもたくさんの部品があるので、もっと知りたい方は公式のドキュメントをご覧ください。Script【GAS】WebアプリやAPIも作れちゃう!HtmlServiceについて、できることをまとめてみた。実際に試してみた部分もあるので、ご紹介したいと思います。Scriptで作ってみた。LINEのチャットボットをGASで作ってみました。思ったよりも簡単にできたので、作り方をご紹介したいと思います。全体の流れは以下の図のようになります。Channel」と、「GAS」です。Script【GAS】WebアプリやAPIも作れちゃう!HtmlService、ContentServiceについて、できることをまとめてみた。APIを使ってみたのでその備忘録です。Scriptで作ってみた。Scriptで作ってみた。APIUncategorizedVMWareVue.jsWordpressランディングページ(LP)タイトルとURLをコピーしました。