AWSでNext.jsをSSRモードで動かす方法について、社内で相談があったので、思いつく選択肢を挙げてみました。
Next.jsのSSRモードは、基本的にNode.jsが動く環境をつくれば動くと考えて良さそうです。
AWSでの選択肢
EC2
オススメ: ★★
選定理由: 複数プロセスを起動したいなど、コンテナでは難しい場合
ECS
オススメ: ★★★
選定理由: バックエンドのAPIなどでECSを使っているのであれば
フロントエンドからRDSを使うならVPC内に立てるための選択肢としても◎
Copilot CLI で ECS を立てる
オススメ: ★★
選定理由: ECSをお手軽に立てたい
立て方の違いだけ
EKS
オススメ: ★★
選定理由: バックエンドのAPIなどでEKSを使っているのであれば
Node.jsの環境をつくれば動く
Lightsail
オススメ: ★★
選定理由: AWSの他のサービスと連携しない案件
VMもしくはコンテナでNode.js環境を作れば動く
DBサービスもある
VPCを気にしなくて良い 専用レンタルサーバーのような感覚
Elastic Beanstalk
オススメ: ★
選定理由: いま選ぶ理由は思いつかない
Node.jsの環境をつくればたぶん動く
AppRunner
フロントだけの案件なら、ECSはオーバースペックだし手軽に動く
VPC ConnectorをつかえばVPC内のRDSなどにアクセス可能
オススメ: ★★★★
Amplify Hosting (自動デプロイ)
オススメ: ★★★★★
選定理由: 爆速開発
ブランチごとのプレビュー環境を作るのも簡単
Next.js 13 SSR 対応済み
WAFとの組み合わせが難で避けられがち
(追記) Amplify Hosting + CloudFront
オススメ: ★★★★★
選定理由: GitHub Actionなど、CI/CDワークフローを自前で用意したい時
ひとつ上の自動デプロイで課題だったWAFをつけてIP制限するなどのカスタマイズもしやすい
S3 + CloudFront + Lambda@Edge
オススメ: ★★★★
選定理由: Serverless+CDN配信によるスケーラビリティ、 サービス利用料が安い
Amplifyで作られるものをサーバーレスサービスを使っって自前で作ろうとすると、こうなる
まとめ
本記事では、AWSでNext.jsをSSRモードで動かすための主な選択肢を紹介しました。
ALBやCDNを組み合わせることでさらなるパフォーマンス向上が可能です。興味のある方は、詳細を調べてみることをおすすめします。
また、ワークロードの特性や関わるメンバーのスキルセットによっても、最適な構成は変わってきます。自社の環境に合った方法を選定することが重要です。
最後に、本記事がNext.jsアプリケーションのデプロイに悩む方々の参考になることを願っています。適切な選択をすることで、高速でスケーラブルなアプリケーションを実現しましょう。