![見出し画像](https://assets.st-note.com/production/uploads/images/98779859/rectangle_large_type_2_e750a771ad470a4c91b41391c9b6780e.png?width=1200)
Google Apps ScriptでHTMLファイルを作成する方法 #2
今回は、Google Apps Script でHTMLファイルを作成する方法について解説しています。
詳しくは動画で解説していますが、ポイントについてNOTEにまとめていますので、よければこちらもご確認ください。
HTMLファイルを作成する方法
![](https://assets.st-note.com/img/1676796692795-EgA6fmCbjN.png?width=1200)
今回は、タスクアプリの作成に関する2回目になりまして、HTMLファイルをデプロイする方法について解説しています。
![](https://assets.st-note.com/img/1676796756213-3krzt1XR8g.png?width=1200)
前回が概要説明でしたので、今回から本格的にコーディングをしていきましょう。
また今回の完成イメージですが、下記のようなものになります。
![](https://assets.st-note.com/img/1676795789955-6X3wt7nlrX.png?width=1200)
内容的には、画面に「Hello World」と言う文字を表示させるだけなので、非常に簡単に思えるかもしれません。ただし Google Apps ScriptでHTMLファイルが作成できるということ自体を知らない方も多いのではないでしょうか。
今回は、HTMLファイルを作成して、デプロイ(公開)をするところまで解説したいと思います。
Google Apps Scriptを開く
いつものようにGASを開きましょう。
![](https://assets.st-note.com/img/1676795944775-SBhsOwH2Oi.png?width=1200)
そして 「ファイルを追加」をクリックして、HTMLファイルを開きましょう。そしてファイル名を「Page.html」に変更します。
そして、HTMLファイルの雛形をそのまま利用して、BodyのパラグラフのところにHello worldと言う文字だけ追加します。
![](https://assets.st-note.com/img/1676796066784-e4IxqyKgAT.png?width=1200)
doGet関数を作成
次は、doGet関数を作成していきます。
![](https://assets.st-note.com/img/1676796146519-4zx5rFKa7b.png?width=1200)
これは、Page.htmlで作成したファイルを、ウェブ上に公開するときに必要な関数になります
function doGet(){
return HtmlService.createTemplateFromFile('Page').evaluate().setTitle('タスク');
}
詳細なリファレンスの説明については、動画で解説していますので詳しく知りたい方はそちらをご確認ください。
ここまで終われば、今回のコーディングは以上です。
デプロイする
コーディングが終りましたので、デプロイに入っていきましょう。
![](https://assets.st-note.com/img/1676796395640-DJWkCIqhPq.png?width=1200)
右上にある青いボタンに囲まれた「デプロイ」をクリックしてください。
![](https://assets.st-note.com/img/1676796390721-TccwJ22xaZ.png?width=1200)
次の画面で種類を選択するところがありますので、「ウェブアプリ」をクリックしてください。
![](https://assets.st-note.com/img/1676796382741-5eY7frujgD.png?width=1200)
次の画面で青いボタンに囲まれたデプロイがありますので、そちらをクリックしてください。
ウェブアプリのURLが生成されます。
![](https://assets.st-note.com/img/1676796383263-FVGyFuH9wO.png?width=1200)
ウェブアプリのURLをクリックすると、WEB上に公開されたHTMLファイルを確認することができます
![](https://assets.st-note.com/img/1676796383792-t6C3NFlVw1.png?width=1200)
このように簡単にGoogle Apps Scriptでは、HTMLファイルをウェブ上にアップロードすることができます。
今回の学習まとめ
今回は、Google Apps ScriptでHTMLファイルをデプロイするということをやってみました。
Google Apps Scriptが、他のGoogleアプリと連携できることを知っている人は多いと思いますが、HTMLファイルとしてウェブ上に公開できると言う事は、意外に知られていない事実です。
知ってると知ってないでは、全くできることが変わってきますので、今回の内容もしっかり覚えてください。
このマガジンまとめ
![](https://assets.st-note.com/img/1676796934910-532iqxhQP1.png?width=1200)
投稿記事と動画を併用しながら、このマガジンを最初から見ていただいた方は、仕事で使えるプログラミングスキルがアップしたのではないでしょうか。
もしGASに興味があれば、マガジンフォローやYoutubeチャンネル登録をお願いします。また今後も様々な仕事に役立つGASスキルを紹介していきますので、よろしくお願いします。