最近は Googleのクラウドサービス、Google Cloud Platform をいろいろ試しています。そして前回から Google App Engineでウェブサイトを無料で作ってみる紹介をしています。今回はその続きとなります。
【Google App Engineでウェブサイトを無料で作ってみた Part.1】
実質無料でウェブサイトができてしまうなんて素晴らしいですよね！通常のプロバイダを利用するよりコスト削減ができてしまう。
今回、通常の Web画面に続いて、最後には WebVRを置いてみてスマホから WebVRを試すなんてことまで紹介しています。
【作業概要 Part.1＆Part.2】
Part.1：
Google Cloud Platformの利用登録
プロジェクトの作成
Google Cloud SDKのイントール
フォルダの準備
app.yamlファイルを作成
index.htmlファイルの作成
Part.2：
App Engineにデプロイ
表示テスト
Web VRを表示
もう少し手の込んだWebVR
【App Engineにデプロイ】
Google Cloud SDKの「Cloud Tools for PowerShell」か「Google Cloud SDK Shell」を立ち上げます。
「cd」コマンドで先ほど作成したルートディレクトリ（ここではプロジェクトIDのフォルダ）に移動します。
そして、「gcloud app deploy」コマンドでApp Engineにデプロイをします。
その際、以下の様に各種情報が表示されますので確認して、「Do you want to continue (Y/n)?」に対して「Y」を入力。デプロイが開始されます。
どうでしょう。無料でウェブサイトができてしまい、WebVRなんかも置くことができました。
上記しましたが、Google Cloud Platformのドキュメントにも無料でウェブサイトができますと書いてあり、これはぜひ使ってみるべきではないでしょうか。
【Google App Engineでウェブサイトを無料で作ってみた Part.1】
実質無料でウェブサイトができてしまうなんて素晴らしいですよね！通常のプロバイダを利用するよりコスト削減ができてしまう。
今回、通常の Web画面に続いて、最後には WebVRを置いてみてスマホから WebVRを試すなんてことまで紹介しています。
【作業概要 Part.1＆Part.2】
Part.1：
Google Cloud Platformの利用登録
プロジェクトの作成
Google Cloud SDKのイントール
フォルダの準備
app.yamlファイルを作成
index.htmlファイルの作成
Part.2：
App Engineにデプロイ
表示テスト
Web VRを表示
もう少し手の込んだWebVR
【App Engineにデプロイ】
Google Cloud SDKの「Cloud Tools for PowerShell」か「Google Cloud SDK Shell」を立ち上げます。
「cd」コマンドで先ほど作成したルートディレクトリ（ここではプロジェクトIDのフォルダ）に移動します。
そして、「gcloud app deploy」コマンドでApp Engineにデプロイをします。
その際、以下の様に各種情報が表示されますので確認して、「Do you want to continue (Y/n)?」に対して「Y」を入力。デプロイが開始されます。
【表示テスト】
Google Cloudの App Engineにデプロイされた Hello Worldの表示テストをしてみます。
コマンドプロンプトから実行するのであれば、「gcloud app browse」を実行。
または、直接WebブラウザからURLとして「https://[YOUR_PROJECT_ID].appspot.com」を入力しても確認することができます。
うまく表示できました。
Google Cloudの App Engineにデプロイされた Hello Worldの表示テストをしてみます。
コマンドプロンプトから実行するのであれば、「gcloud app browse」を実行。
または、直接WebブラウザからURLとして「https://[YOUR_PROJECT_ID].appspot.com」を入力しても確認することができます。
うまく表示できました。
【Web VRを表示】
少し Google Cloud Platformネタとは異なりますが、以前 A-Frameを利用して WebVRを簡単に作る説明記事を書きました。
【A-Frameで簡単にWebVRを実現】
これを今回の Google Cloud Platform上において試してみましょう。ここでは、index.htmlファイルから A-Frameを組み込んだ HTMLファイルにリンクする形にしておきます。
WebVR側は以前の説明記事のものをそのまま利用です。
ファイルはwwwフォルダに置いてしまいます。
先ほど説明した方法でデプロイを行います。そして実行。
リンクをクリックするとうまく WebVRが動きました！これが無料でアップできてしまうわけですね。
【もう少し手の込んだWebVR】
以前の WebVRの説明で作成した、もう少し手の込んだ WebVRも試してみましょう。これも基本的には中身は以前と同じです。
表示するための画像や３Dモデルファイルがあるので、それらを以下の様に配置。
そして、先ほどと同じようにデプロイを行います。そして実行。リンクをクリックしてWebVRのページを表示すると画像や３Dモデルもうまく表示されています。
もちろんスマホからもうまく表示されています。
WebVRなので WebVRの機能も試します。当然うまく行ってます。
少し Google Cloud Platformネタとは異なりますが、以前 A-Frameを利用して WebVRを簡単に作る説明記事を書きました。
【A-Frameで簡単にWebVRを実現】
これを今回の Google Cloud Platform上において試してみましょう。ここでは、index.htmlファイルから A-Frameを組み込んだ HTMLファイルにリンクする形にしておきます。
WebVR側は以前の説明記事のものをそのまま利用です。
ファイルはwwwフォルダに置いてしまいます。
先ほど説明した方法でデプロイを行います。そして実行。
リンクをクリックするとうまく WebVRが動きました！これが無料でアップできてしまうわけですね。
【もう少し手の込んだWebVR】
以前の WebVRの説明で作成した、もう少し手の込んだ WebVRも試してみましょう。これも基本的には中身は以前と同じです。
表示するための画像や３Dモデルファイルがあるので、それらを以下の様に配置。
そして、先ほどと同じようにデプロイを行います。そして実行。リンクをクリックしてWebVRのページを表示すると画像や３Dモデルもうまく表示されています。
もちろんスマホからもうまく表示されています。
WebVRなので WebVRの機能も試します。当然うまく行ってます。
どうでしょう。無料でウェブサイトができてしまい、WebVRなんかも置くことができました。
上記しましたが、Google Cloud Platformのドキュメントにも無料でウェブサイトができますと書いてあり、これはぜひ使ってみるべきではないでしょうか。
Sponsored Link
E-Mail: 