Next.js(SSR)をLambdaでホストしてみる_jaws_education

Transcript

1. Next.js(SSR)をLambdaで ホストしてみる Education-JAWS #5 山下 拓海 Education-JAWS #5 1
2. 自己紹介 福井大学４年生！ ユニフォームネクストでインターン中 Lambda，VPC Latticeが好き Vim一年生 2 Education-JAWS #5 ２２歳 山下　 拓海（やました　 たくみ）
3. アジェンダ 詳しい実装 メリット・デメリット 問題点 まとめ 3 Education-JAWS #5 Next.js in Lambda Next.jsインフラ概要
4. Next.jsインフラ概要 一般的なNext.jsインフラアーキテクチャ 4 Education-JAWS #5 CloudFrontでCDN配信 S3に静的ファイル EC2やECSが固定料金 インフラ構築が大変 EC2やECSで Next.jsサーバーをホスト
5. 5 Education-JAWS #5 今回採用するインフラアーキテクチャ CloudFrontでCDN配信 S3に静的ファイル Lambdaで Next.jsサーバーをホスト 実行された分だけ課金 サーバーレスで構築が楽 Next.jsインフラ概要
6. Next.js In Lambda 6 Education-JAWS #5 Lambdaって 関数実行するやつじゃないの？？
7. Next.js In Lambda 7 Education-JAWS #5 LambdaでNext.jsをホスト Q：「Lambdaって関数実行するやつじゃないの？？」
8. Next.js In Lambda 8 Education-JAWS #5 LambdaでNext.jsをホスト A：「 という 　 　 サーバーのホストが可能になるライブラリが 　 　 あります！」 Lambda Web Adapter A：「イメージとしてデプロイして、Dockerfileに 　 　 １行追加するだけ！！」 Q：「でも設定難しいんじゃないの？？」
9. アーキテクチャ 9 Education-JAWS #5 全体のアーキテクチャ
10. 詳しい実装 10 Education-JAWS #5 Next.jsの設定 ビルドした成果物をstandaloneという形式で生成 next.config.tsのoutputを編集
11. 詳しい実装 Education-JAWS #5 Dockerイメージの作成 ECS等でデプロイするときと同じ！ 11
12. 詳しい実装 Education-JAWS #5 Lambdaへのデプロイ ECRなどにイメージをアップロード Lambdaへデプロイ！！ ここにアップロードしたECR URIを指定 12
13. メリット・デメリット Education-JAWS #5 Lambdaのメリット ランニングコストが少なくなった！ インフラ構築がめっちゃ楽！ App Runnerを使用していた時と比べて99%減 （というか100%） Lambdaのコストが0円！（無料枠） スケーリングとかパッチとか考えなくて良い DBなどのVPCリソースへのアクセスがあると 面倒... 13
14. メリット・デメリット Education-JAWS #5 Lambdaのデメリット 同時実行回数が1000（デフォルト） コールドスタート 15分以上の処理ができない 初めてアクセスがある場合、表示まで遅い API Routes使うと超えるかも？ 全く同時タイミングで1000件のリクエストがあ るとエラーになってしまう 14
15. ビルド結果 問題点 Education-JAWS #5 S3を静的ファイルとして使うとハマる デプロイする流れによってはS3とLambdaのコード が変わり静的ファイルが404 別でビルドしているため、ビルド成果物が同じとは限らない... ビルド結果 ビルド Dockerビルド 15
16. 問題点 Education-JAWS #5 S3を静的ファイルとして使うとハマる じゃあどうするのか 同じビルド成果物をデプロイすれば良い ビルド結果 ビルド Dockerビルド 16
17. 問題点 Education-JAWS #5 これをCI/CDで実現 CodeBuild CodeDeploy Next.jsビルド S3へ静的ファイルをPut ECRへイメージをPush Lambdaのデプロイ 17
18. まとめ Education-JAWS #5 最終的なアーキテクチャ 18
19. まとめ Education-JAWS #5 メリットデメリットある Next.jsをLambdaで構築できる！ CI/CDも組み込めると最高 小規模、スタートアップは最高だと思う 大規模だと無理かも 19
20. まとめ Education-JAWS #5 良いLambdaライフを！ 20