AWSでは超格安で、Webサイトホスティングが可能です。
GAEとかHEROKU使って無償でというのもありますが、少し色々やった感を得られます。w
ただ、その自己満足のためだけではなくて、、、私自身はこの手法を応用することで柔軟にWebページやコンテンツの配信に活用できるという点で、GAEよりも扱いやすく、プログラマチックに量産できるという点でAWSでのホスティングのメリットが大きいと考えています(コンピューティングがGCPメインなら話は変わると思いますがAWSなので)。
今回は、それらの技術周りの確認を行うためにやったことの整理です。
対象者（いるのかな？）
AWSを普段使っていて、さっとページを立ち上げる必要があるプログラムを作っている人（あまり、ないかな？）
例えば、コンテンツマーケティングの記事を量産して、機械学習でテキスト文を自動生成してページを量産するなどをやるとか。（検索indexを汚すだけになるので、質が低いならやるべきではないですが）
あとは、エンジニアの腕試し（AWSに慣れる、サーバーレスに触れる）という意味では良い題材かな、と。
早速、レシピを
まず、S3でのホスティングになると静的ページメインですが、Ajax × Lambdaを使えば、いろんなこと出来ると思います。（ここは実際にはやっていません）
その時に必要なものと金額（ざっくり）をまとめてみました。（間違っていたらすいません。）
BlogはBloggerなどを使えばいいし、と割り切れる人向け。
▼用意するもの
| 用途 | 必須/任意 | サービス | 費用（東京リージョンベース） | コメント | 参考 |
|---|---|---|---|---|---|
| ストレージ | 必須 | S3 | 0.025USD/月 以下（1GB以下） | 「独自ドメインを使ってAmazon S3で静的Webサイトをホストする」 | |
| CDN | 必須 | CloudFront | 0.140USD/月 （日本だけなら） | AWS Certificateを使用するため必須、ELB使う場合はそちらでも良い | CloudFront に SSL 証明書を導入する際のポイントまとめ |
| DNS | 任意 | Route53 | 0.5USD/月 | AWSでなく、別DNSからCNAMEしても良いかも。Route53だと設定が少し楽。 | |
| ドメイン代 | 必須 | - | 1円/年~ | AWSでも取得可能だが別で取った方が安い？（ドメインによる） | |
| SSL | 必須 | Certificate Manager | 無料 | 昨今の事情的に必須 | |
| イベントキック | 任意 | API Gateway | 0.14USD/GB | 静的ページの問い合わせからAjaxで起動させる入り口。王道？ | |
| Cognito | 無料（50,000 MAUまで） | IAMさらしたくない人に。少しだけ面倒。 | |||
| なし（IAM直書き） | 無料 | IAMで問い合わせを行うだけのLambda関数だけに制限すれば、 | |||
| イベント処理 | 任意 | Lambda | 0.0000002 USD/リクエスト | ||
| メール送信 | 任意 | SES | 無料 （62,000 通以内なら） |
メール送信とかは、<a href="mailto:xxx@co.jp">メール</a> みたいな感じでメーラー立ち上げにすれば、イベントキック以降は不要です。
1ドル以下と言っていますが、Route53使わず実費ベースで行くと、0.1ドルくらいなのではないでしょうか？
つまずきポイント
(1)CloudFrontに設定するドメインは、s3のバケットのURLではなく、website用のURL
▼（CloudFront上で表示される）こっちじゃなくて
▼websiteホスティングのエンドポイントを使う
つまり、
・間違い ： xxxx.s3.amazonaws.com
・正しい ： xxxx.s3-website-{region}.amazonaws.com
見落としますよね。。。（これは尊敬するAWSのUIの問題かと思います）
(2) S3のバケットポリシーの設定は必須（ホスティング設定しただけでは公開されない）
参考：「独自ドメインを使ってAmazon S3で静的Webサイトをホストする」
{
"Version":"2012-10-17",
"Statement":[
{
"Sid":"AddPerm",
"Effect":"Allow",
"Principal": "*",
"Action":["s3:GetObject"],
"Resource":["arn:aws:s3:::{yourdomain.com}/*"]
}
]
}
この{yourdomain.com}の部分は、{}も含めて置き換えです。
例えば、サイトドメインが"anniv-finder.site"なら
"Resource":["arn:aws:s3:::anniv-finder.site/*"]
のように
(3) Certificate Managerの取得はリージョンに注意
-> 同じリージョンで取得しなければ、承認通っているのに反映されません（一瞬ハマりました）
(4) 通常、S3ホスティングの場合は、使用するドメイン名とバケット名が同じではなくてならないので、その癖で、違うバケット名でも試していないので不明ですが、CloudFrontを通す場合は、問題なさそう？でも、管理用に、ドメイン名（anniv-finder.site）などで取っておくのが整理されて良い
(5) （関係ないですが）S3をIPブロックする時は注意が必要。管理者権限でも見れなくなリマス（root権限でバケットポリシー を書き直す必要があります）
ぐらいじゃないでしょうか。
メリット・デメリット（これもまたざっくりと。）
| 作成方法 | メリット | デメリット |
|---|---|---|
| 節約Webサイト | ・激安（10~100円） ・CDN使えて高速 ・SSL更新など不要 ・サーバー管理ゼロ |
・動的なことはやりづらい |
| WordPress | ・格安(500円~3000円) ・簡単 ・だいたいやりたい事は出来る ・開発知識はあまりいらない |
・DB使うのでコストかかりがち ・レンタルサーバーだとアクセス増えると辛い |
| Wixやペライチ | ・まぁまぁ安い（980円~2980円） ・簡単 ・開発知識はゼロでもOK ・最速（小規模だと３〜５時間あれば作れる） ・サーバー管理ゼロ |
・カスタマイズ性乏しい |
| フルスクラッチ | ・なんでも出来る ・独自性を出せる? |
・開発知識必要(やることによる) |
＜所感メモ＞
・エンジニア知識が増えれば増えるほど、「車輪の再発明」をやりたくなくなるので、フルスクラッチから遠ざかる？
・貧乏Webサイトは、サーバーレスWebサイトと呼ぶとモダンな感じになる
・サーバーレスなWordpressとか出てくるかも
・IAMって制限しまくっていても晒すのが嫌なのはなぜだろう
どういうサイトが作れるの？という方へ、以下がこの方法で作った遊びサイトです。
（注：突然、変更したり落としたりするかもしれませんが、リンクが切れていたら、その際はお察しください。）
anniv-finder.site
▼ただ遊んでいるわけではなく・・・
この技術を応用すると、実は色んなことが格安で出来ると考えていまして、これを検証するために作ってみました。
応用すると、遊びサイトの立ち上げとかは思い立ったら作れます（これは応用というかこのままですが）し、Webコンテンツの量産もできますし、計測とかタグ管理とか、（Computing）サーバーを立ち上げる必要がない（＝メンテナンス・管理が不要）ということになります。