132
63

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

AWSでNext.jsをSSRモードで動かしたい場合の選択肢

Last updated at Posted at 2023-04-10

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アプリケーションのデプロイに悩む方々の参考になることを願っています。適切な選択をすることで、高速でスケーラブルなアプリケーションを実現しましょう。

132
63
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
132
63

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?