Napa Log

Blog

貧乏性な私がNextjsブログを レンタルサーバー → AWS S3へ移行して節約を夢見る

サムネイル

【本ホームページはレンタルサーバーで動いています!】

と言おうと思っていましたが、この記事を見ているころにはAWSで動いていることになりますね、、、無事投稿できれば、、!

今回はホームページをレンタルサーバー から AWSへ移行したのでその話をしようと思います。

クラウドへ移そうと思った経緯

節約のため

一番はこれです。
従来まで、ホームページ+ブログをNextJs×MicroCMSで作成して、レンタルサーバーで動いていました。
当時の開発した私は、JavaAPIの改修案件しか行ったことなく、フロントエンドの知見が全くありませんでした。
その時にたまたま調べた結果が、「レンタルサーバー上で、nodeサーバーを立ててNextJsを動かす!」というものだったので、そうなっています。
それ以上でもそれ以下でもないです。当時Nextjsのレンダリング手法もよくわかっていなかったことになりますね。

人間不思議なもので、狭い範囲のことが慣れてきた途端、望んでもないのに勝手に視野が広くなるんですね。
電車の中で「あ、これもっと安くできるな」と思い立ったのが発端です。
ちなみに、毎月サーバーに600円ぐらい払ってます。

サーバーレンタルより設定が簡単そう

もう一つの理由として、設定の手間が結果的に少なかった、というものです。
レンタルサーバーでも大変苦労しましたよ。。。

  • まず、どこのレンタルサーバーが安いか、自分の用途に一致しているか調査。
  • 借りた後、サーバーにUbuntuを0から構築。
  • nextjsでのサイト開発を実施
  • ドメインの取得・証明書設定(ここが一番つらかったです。)
  • nginxでのリクエストの処理を設定 etc...

ここに書ききれないだけで実際はもっと壁にぶつかりました。
AWSだと、これらの設定も本当に簡単でした。

構成

構成図書いてみました。構成図なんて実務で書いたことないので、苦労しました。

構成図作成ツール:draw.io(vscode)

なぜS3?

サイトの規模とアクセス数が多くないので、一番安く済みそうと思ったからです。
CI/CDをメンテナンスしないと、記事更新のたびにビルドも必要になりますが、投稿は毎日とかではないので、苦にならないです。

APIはmicroCMSを呼び出すところしか走っていませんので、複雑なサイトではありません。
静的生成で出来上がった私のサイトはせいぜい9MBです。微々たる金額で済みそうです。

ドメインは妥協で、route53に泣く泣く移行

もともとconoha serverを借りてまして、そこでドメインを購入していました。なので、conohaのDNSにドメインが登録されていたのですが、そのままでAWSのcloudFrontに紐づけすることは技術的に可能です(言ってみたかった)

ただ、私のドメイン周りの知識が浅いため、紐づけに相当苦労しました。ですので、AWS内で統一すると設定しやすいかと思い、route53をDNSとして設定しています。これが意外とお金かかるんですよね。。。0.5ドルほどです。

S3へのアクセスは、CloudFront以外からはブロック

ここは注意しました。CloudFrontだと、CDNが使用されているので、キャッシュが有効ですので、毎回S3のリソースを読み込んでということにはなりません。この設定無しで、直接S3へアクセスだと、毎回ファイルを提供することになり、私も訪問者様も損です。
なので、CloudFrontからユーザーへ返却するようにし、なおかつ、S3は他からは触れないようにしています。

{
    "Version": "2008-10-17",
    "Id": "PolicyForCloudFrontPrivateContent",
    "Statement": [
        {
            "Sid": "AllowCloudFrontServicePrincipal",
            "Effect": "Allow",
            "Principal": {
                "Service": "cloudfront.amazonaws.com"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::***********/*",// 情報をマスクしてます
            "Condition": {
                "StringEquals": {
                    "AWS:SourceArn": "arn:aws:cloudfront::***************************" // 情報をマスクしてます
                }
            }
        }
    ]
}

一か月運用してみての金額

0.6ドル弱。 0.6 × 150 = 100円弱でしょうか。今のアクセス数であれば、このままで済みそうですのでいい感じです。
0.5ドルがRoute53でかかっている費用ですので、私の技術の敗北です。

※AWSコンソール画面を使用しています。

触ってみると意外といける、そして楽しい

AWSは本当に触ってこず未知の領域でしたが、なんだかんだいけるもんですね。
EC2だったりはインスタンスの起動時間でお金かかるし、負荷がかかると自動でスケーリングするようで、個人では怖くて使えないですが、そんな怖いものばかりではないのだな、と気づきを得られました。
手軽なところからお試しで触ってみるのはいかがでしょうか?

まだCI/CDの設定や、CloudFrontのキャッシュ削除、元のサーバーのお片付けだったりがありますので、AWS関連のお話は投稿すると思います。
もっと知りたいということがあれば、DMなりいただけるとお返事いたしますので、お気軽に、です。

参考

https://aws.amazon.com/jp/s3/pricing/

https://nururuv-blog.com/237/index.html

https://qiita.com/shinnoki/items/9cf68e68cbe594732b4b