最近は Googleのクラウドサービス、Google Cloud Platform をいろいろ試しています。前にもいくつか初心者用の説明を書きました。

Google Cloud Platformの利用登録からApp EngineでPHPサンプル実行まで
Google Cloud PlatformのCloud SQL for MySQLを試してみる


今回は機能的に試してみると言うより、単純にウェブサイトをとても簡単に作ってみようと言うこと。そして無料枠内で行うので、実質無料でウェブサイトができてしまう。要は通常のプロバイダを利用するよりコスト削減ができてしまう。
GCP_68
別に何か裏技を使うわけでもなく、普通に Google Cloud Platformのドキュメントにそう書いてあるので、どうどうと無料でウェブサイトができるわけです。

https://cloud.google.com/appengine/docs/

このドキュメントに設定のしかたが書いてありますので、それにそってここでは説明していこうと思います。


【作業概要 Part.1&Part.2】

 Part.1:

  Google Cloud Platformの利用登録
  プロジェクトの作成
  Google Cloud SDKのイントール
  フォルダの準備
  app.yamlファイルを作成
  index.htmlファイルの作成

 Part.2:

  App Engineにデプロイ
  表示テスト
  Web VRを表示
  もう少し手の込んだWebVR



【Google Cloud Platformの利用登録】

(既に利用登録済みであれば、ここはスキップして下さい。)
もし Google Cloud Platform自体を初めて使うのであれば、まず最初に Google Cloud Platformの利用登録が必要です。
GCP_02

無料トライアルで登録ができます。以前登録法を説明していますので、以下のページをご覧ください。

Google Cloud Platformの利用登録からApp EngineでPHPサンプル実行まで Part.1


【プロジェクトの作成】

(ここからは、使用するプロジェクトが既に作成済みの方はスキップできます。)
ここでは、Google Cloud Platformのコンソールから以下を行います。

 ・プロジェクト作成
 ・Google App Engineの初期設定
 ・プロジェクトの課金の有効化


これらも以前説明をしております。以下のページをご覧ください。

Google Cloud Platformの利用登録からApp EngineでPHPサンプル実行まで Part.1


【Google Cloud SDKのイントール】

(ここも、Google Cloud SDKをインストール済みであればスキップができます。)
これまでは、Google Cloud Platform側の設定を行ってきました。ここではローカル側の設定を行います。

ローカル側には Google Cloud Platformにアプリをデプロイ等するのに使用する、Google Cloud SDKをイントールします。以下の作業を行います。詳細は以前書いた説明をご覧ください。

 ・Google Cloud SDKをインストール
 ・Google Cloud SDKの初期設定


Google Cloud Platformの利用登録からApp EngineでPHPサンプル実行まで Part.2


【フォルダの準備】

Google Cloud Platformにデプロイするローカル側のフォルダを作成しておきます。
ここではルートディレクトリとしてプロジェクトIDのフォルダを作成します。その中のフォルダ、ファイルをアップロードする形となります。

以下のようなフォルダを作成します。

・[(何でもよいです)]/ :ルートディレクトリ
  - www/
    - css/ :スタイルシートを保存するフォルダ。
    - images/ :画像を保存するフォルダ。
    - js/ :JavaScriptファイルを保存するフォルダ。

GCP_69


【app.yamlファイルを作成】

App Engine アプリケーションの設定を記述するファイルとなります。
テキストエディタで「app.yaml」を作り、先ほど作成したフォルダのルートディレクトリ(ここではプロジェクトIDのフォルダ)直下に置きます

中身は以下のコピーで良いです。PHP7用になってます。(Googleのドキュメントでは PHP5での例がありますが、Googleも PHP7の使用を勧めていますので。)

runtime: php72

handlers:
- url: /
  static_files: www/index.html
  upload: www/index.html

- url: /(.*)
  static_files: www/\1
  upload: www/(.*)

GCP_70


【index.htmlファイルの作成】

テキストエディタでウェブサイトのルートページで表示される HTMLファイル「index.html」を作成します。このファイルは先ほど作成した wwwフォルダ内に置きます

中身は Googleドキュメントと同じ Hello Worldを表示するだけの簡単なものにしておきます。

<html>
  <head>
    <title>Hello, world!</title>
    <link rel="stylesheet" type="text/css" href="/css/style.css">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <p>
      This is a simple static HTML file that will be served from Google App
      Engine.
    </p>
  </body>
</html>

GCP_71


少し長くなるので、今回はここまでで。今回は初心者用に Google Cloud Platformの登録から準備、アップする HTML等のファイル作成をしました。次回は実際に App Engineにデプロイするのと、もう少し手の込んだ画面としてWebVRの画面も試してみます。
Sponsored Link