AWS上にわずか数円で実質無限にスケールするWebサイトを構築する
AWSのS3やCloudfrontを活用し、わずか数円で実質無限にスケールするサイトやブログを構成する方法をご紹介したいと思います。（まさにこのブログはこの構成をとっております。）
AWS S3の静的ホスティング・サーバーレス構成を活用
数年前までよくあった構成
以前までサイトを運営するとなると、Webサーバ、APサーバ、データベースが存在するWeb2層、Web3層が主流でした。（これらの複数の機能を1つのサーバ上にのせるケースも含む）
WordpressやCMS、会員サイト等の動的サイトを作成する場合、Web/APサーバやデータベースサーバを利用することが当たり前で、システム運用、コストがどうしてもかさむケースが多かったと思います。
もちろん今でも大規模なシステムや、複雑な動的サイトを構築する場合には同様の構成をとることも多々あります。
静的コンテンツであればS3を利用可能
会員サイトや、ブログ（コンテンツや、サイドバーによくあるアクセスランキングなども）などの動的サイト（システム的には裏でデータベース等へのアクセスが必要なサイト）では前述の通りリッチな構成が必要でしたが、
静的コンテンツではHTML/Javascript/CSSを配信するだけで良いので、サーバやVPSを用意することなく静的ホスティングサービス（有料、無料、多数存在。AWSのS3もその１つ）を活用し、安く、性能的にも優位に運用することが可能でした。
（SSL対応や、セキュリティなどの話もありますが、次回別の機会でブログにしたいと思います）
Javascriptの躍進により静的ホスティングが日の目を見る
昨今ではクラウドやREST APIの普及と並行して、HTML5が普及し、”Web”で様々なことができるようになってきました。（Cloud9やGoogleDocsのようにさまざまなアプリケーションでさえWebでやる時代に！）
もともと静的ホスティングでは、 “静的なもの” しか配信できませんでしたが、JavascriptをベースとしたReact、Angular、Vueなど流行し、APIや各種クラウドサービス（Cognitoなどを活用し、直接DynamoDBやS3にアクセスする2Tierアーキテクチャも存在。詳細はまた別の機会に）と連携することで静的ホスティングなのに動的なコンテンツを配信することが容易になってきました。
S3やCloudfrontを利用した静的ホスティング運用で激安に運用
AWSではS3というオブジェクトストレージのサービスを利用して静的ホスティングが可能で、さらにCDNサービスであるCloudfront、SSL/TLS証明書プロビジョンサービスであるCertificate Manager、DNSサービスであるRoute53などを活用することで、
- CDNを利用した高速コンテンツ配信
- 独自ドメイン
- https対応
- 費用はわずか数円（※厳密にはアクセス数による）
な、サイトを作成することができます。前述したとおり、これにReact/Angular/VueなどのJavascriptフレームワークとAPIや各種クラウドサービスを組み合わせることで動的サイトを構築することも可能です。
実際の構成の紹介
前段が長くなりましたが、それでは実際の構成をご紹介したいと思います。
全体像
全体像はこんな感じ。詳細は各環境切り取って細かく説明したいと思います。
Web公開部分
このブログはHugoという静的コンテンツジェネレータを利用してコンテンツを作成しているのですが、生成したHTML/CSS/JavascriptをS3上に配置し、Cloudfrontと連携してコンテンツを公開してます。S3で直接静的ホスティング機能でWeb公開することもできるのですが、
- 独自ドメイン対応＋https対応
- 性能
- Dos攻撃によるAWS料金破産
などを考慮し、Cloudfrontを前段に挟んでます。（まあCloudfrontを挟むのは当たりまえですね）
S3とCloudfrontを連携する場合は、S3で静的ホスティング設定はせず、OAI（Origin Access Identity）を利用してS3からCloudfrontにのみ公開する設定をいれましょう。そうしないと横からS3にアクセスされ、Dosアタックされる可能性あります。
フォームや個人情報を扱いサイトだけでなく、個人のサイト含め常時SSLが当たり前になってきており（参考：Googleが全面支持する「常時SSL」のSEO対策への影響とは）、AWS Certificate Managerを利用して独自ドメインを活用しつつ、https対応させています。（ACMは無料です！）
ドメインはどこで取得しても良かったのですが（Route53でもドメイン取得可能）、（個人的話ですが）GMOの株主優待で毎年1万円まで無料でお名前.comが利用できることもあり、お名前.comでドメイン取得してます（GMOの株主おすすめです！笑）。
お名前.comで取得したドメインをRoute53に連携し、Route53側でDNS管理しております。（お名前.com側でもDNSの機能はありますが、今回あえてAWSフル活用ということでRoute53を利用してますｗ）
少し長くなってきたので、次回別記事で開発環境・ブログ記事更新環境とCI/CD（自動ビルド、自動サイト更新）、それからAWS利用料金について書きたいと思います。
