Cloud RunとCloud Build で激安超簡単、月額10円・10分で出来るSSL/TLS独自ドメインWebサーバー構築

# 概要
Google Cloud Platform（以下GCP）のCloud Runを使って、独自ドメイン https:// 付きWebサーバを立てます。
Cloud Runは従量課金のPaaSで、無料枠もあり、アクセスの少ないサイトなら無料で公開できます。さらにManaged SSL証明書も無料で使えます。
HTML/CSSソースはGitHubに保存し、Commitをトリガーに自動デプロイを仕掛けます。
[Cloud Run（フルマネージド）の料金](https://cloud.google.com/run/pricing?hl=ja)
# 用意するもの
* クレジットカード - ドメインを購入したりGCPの課金を有効化する際に使います。
* Google Account - gmailアカウントでOK
* GitHub Account

# 手順
### ドメイン取得
お名前.comにて、.workドメインが1円セールだったので、foobarbar.work ドメインを取得しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/4591ec43-fb75-87e4-abd8-cdcfc3fac240.png)

### GitHubリポジトリ初期化
取得したドメインと同じリポジトリを初期化。.gitingore とかはお使いの言語に合わせて適宜追加してください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/ac68c273-2e77-6b6e-f918-b7bd601b41a6.png)

### local Git 初期化
というかクローン。

```
PS D:\Projects> git clone git@github.com:standardsystem/foobarbar.work.git
Cloning into 'foobarbar.work'...
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Total 3 (delta 0), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (3/3), done.
PS D:\Projects> cd .\foobarbar.work\
PS D:\Projects\foobarbar.work> ls

    Directory: D:\Projects\foobarbar.work

Mode                 LastWriteTime         Length Name
----                 -------------         ------ ----
-a---          2020/10/15    21:36             40 README.md

PS D:\Projects\foobarbar.work> git branch
* main
PS D:\Projects\foobarbar.work>             
```

### HTML投入
こちらからテンプレート頂きました。
https://colorlib.com/wp/template/mosh/ 

### Dockerfile 追加
[Cloud Run>ドキュメント>クイックスタート: ビルドとデプロイ](https://cloud.google.com/run/docs/quickstarts/build-and-deploy?hl=ja#php) から、Dockerfileのサンプルを持ってきます。COPYの所だけ、index.php から　. へ変更。

```Dockerfile:Dockerfile
# Use the official PHP 7.3 image.
# https://hub.docker.com/_/php
FROM php:7.3-apache

# Copy local code to the container image.
COPY . /var/www/html/

# Use the PORT environment variable in Apache configuration files.
RUN sed -i 's/80/${PORT}/g' /etc/apache2/sites-available/000-default.conf /etc/apache2/ports.conf

# Configure PHP for development.
# Switch to the production php.ini for production operations.
# RUN mv "$PHP_INI_DIR/php.ini-production" "$PHP_INI_DIR/php.ini"
# https://hub.docker.com/_/php#configuration
RUN mv "$PHP_INI_DIR/php.ini-development" "$PHP_INI_DIR/php.ini"
```
.dockerignoreも追加。

```.dockerignore:.dockerignore
Dockerfile
README.md
vendor
```


### Commit & Push

```
git add .
git commit -m 'First commit'
git push origin main
```

### GCP Project 作成
https://console.cloud.google.com/ で新しいプロジェクトを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/e58ff4eb-4364-8ea3-8418-25e7c208069f.png)

### Cloud Run サービスの作成とCloud Buildの構成
メニューからCloud Runを選択、サービスの作成をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/4f8cd795-da5b-d51b-8443-35fdcb62d652.png)
フルマネージド、リージョンはTokyo。サービス名を入力し、未認証許可を選択。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/7b462f91-86df-a649-8fdd-e912710bca0f.png)
「ソース リポジトリから新しいリビジョンを継続的にデプロイする」を選択。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/d29a1014-55f8-26b7-d3da-439e8d4cc3f4.png)
「SET UP WITH CLOUD BUILD」をクリックし、2つのAPIを有効化します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/802332c2-57bf-e922-36a3-0ebde586cae9.png)

リポジトリを選択。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/6f79cc9a-7a97-4a2c-33dd-dee43d71d89b.png)
ブランチとビルド方法を選択。「作成」ボタンをクリックすると、Cloud Buildによりビルドが開始します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/7e7744be-7074-8ccb-2a58-bd24a4b981fd.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/2fd447a4-5b34-80aa-2f81-e3489b0eef66.png)

### テスト
Cloud Run機能に戻るとサービスができてます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/a022769b-0483-2356-e4bb-ca236ed95d49.png)
サービス名をクリックして詳細を表示するとURLが記載されているのでクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/7ff0ee8b-c23f-0c3e-3650-f738396ad5b9.png)
サイトができました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/c632c469-60cf-02b0-6f95-1d9055037c38.png)

### 独自ドメインの設定
カスタムドメインを管理。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/0b2b06b2-c54c-955e-2c5f-611362516e8a.png)
マッピングを追加。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/7ca3da63-7ea4-544e-8c81-23a7ec5a40dd.png)
サービスを選択し、verify a new domain... で取得したドメインを入力。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/629ba079-adc0-687a-9344-85b8db81c837.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/1d4df3c1-21aa-d18b-09ad-82966fac3859.png)
ウェブマスターセントラルの指示に従い、TXTレコードをDNSに追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/981c5b5c-2978-a345-4b08-aef2b54df358.png)
追加したら数分待ち、ウェブマスターセントラルに戻って「確認」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/d7dd0821-f096-e048-beb6-c3f7d1eefc10.png)
マッピングの追加に戻り、ドメインを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/a595dd6e-3ef2-64c7-d555-de5a995e745a.png)
表示されたDNSレコードを対象ドメインのゾーンレコードに追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/6fb1a935-7329-1bcc-d6c9-26761b01a104.png)
ドメインマッピングに戻り、ホスト名をクリックします。DNS浸透まで相応の時間がかかります。のんびり待ちましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/12857/f4a8aed2-fc70-5972-68f4-56304e9163d7.png)


https://foobarbar.work/ が公開されました。
ソース
https://github.com/standardsystem/foobarbar.work