Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Next.js(SSR)をLambdaでホストしてみる_jaws_education
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
takumi
October 23, 2025
Programming
200
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Next.js(SSR)をLambdaでホストしてみる_jaws_education
takumi
October 23, 2025
Transcript
20 slides
Next.js(SSR)をLambdaで ホストしてみる Education-JAWS #5 山下 拓海 Education-JAWS #5 1
自己紹介 福井大学4年生! ユニフォームネクストでインターン中 Lambda,VPC Latticeが好き Vim一年生 2 Education-JAWS #5 22歳
山下 拓海(やました たくみ)
アジェンダ 詳しい実装 メリット・デメリット 問題点 まとめ 3 Education-JAWS #5 Next.js in
Lambda Next.jsインフラ概要
Next.jsインフラ概要 一般的なNext.jsインフラアーキテクチャ 4 Education-JAWS #5 CloudFrontでCDN配信 S3に静的ファイル EC2やECSが固定料金 インフラ構築が大変 EC2やECSで
Next.jsサーバーをホスト
5 Education-JAWS #5 今回採用するインフラアーキテクチャ CloudFrontでCDN配信 S3に静的ファイル Lambdaで Next.jsサーバーをホスト 実行された分だけ課金 サーバーレスで構築が楽
Next.jsインフラ概要
Next.js In Lambda 6 Education-JAWS #5 Lambdaって 関数実行するやつじゃないの??
Next.js In Lambda 7 Education-JAWS #5 LambdaでNext.jsをホスト Q:「Lambdaって関数実行するやつじゃないの??」
Next.js In Lambda 8 Education-JAWS #5 LambdaでNext.jsをホスト A:「 という
サーバーのホストが可能になるライブラリが あります!」 Lambda Web Adapter A:「イメージとしてデプロイして、Dockerfileに 1行追加するだけ!!」 Q:「でも設定難しいんじゃないの??」
アーキテクチャ 9 Education-JAWS #5 全体のアーキテクチャ
詳しい実装 10 Education-JAWS #5 Next.jsの設定 ビルドした成果物をstandaloneという形式で生成 next.config.tsのoutputを編集
詳しい実装 Education-JAWS #5 Dockerイメージの作成 ECS等でデプロイするときと同じ! 11
詳しい実装 Education-JAWS #5 Lambdaへのデプロイ ECRなどにイメージをアップロード Lambdaへデプロイ!! ここにアップロードしたECR URIを指定 12
メリット・デメリット Education-JAWS #5 Lambdaのメリット ランニングコストが少なくなった! インフラ構築がめっちゃ楽! App Runnerを使用していた時と比べて99%減 (というか100%) Lambdaのコストが0円!(無料枠)
スケーリングとかパッチとか考えなくて良い DBなどのVPCリソースへのアクセスがあると 面倒... 13
メリット・デメリット Education-JAWS #5 Lambdaのデメリット 同時実行回数が1000(デフォルト) コールドスタート 15分以上の処理ができない 初めてアクセスがある場合、表示まで遅い API Routes使うと超えるかも?
全く同時タイミングで1000件のリクエストがあ るとエラーになってしまう 14
ビルド結果 問題点 Education-JAWS #5 S3を静的ファイルとして使うとハマる デプロイする流れによってはS3とLambdaのコード が変わり静的ファイルが404 別でビルドしているため、ビルド成果物が同じとは限らない... ビルド結果 ビルド
Dockerビルド 15
問題点 Education-JAWS #5 S3を静的ファイルとして使うとハマる じゃあどうするのか 同じビルド成果物をデプロイすれば良い ビルド結果 ビルド Dockerビルド 16
問題点 Education-JAWS #5 これをCI/CDで実現 CodeBuild CodeDeploy Next.jsビルド S3へ静的ファイルをPut ECRへイメージをPush Lambdaのデプロイ
17
まとめ Education-JAWS #5 最終的なアーキテクチャ 18
まとめ Education-JAWS #5 メリットデメリットある Next.jsをLambdaで構築できる! CI/CDも組み込めると最高 小規模、スタートアップは最高だと思う 大規模だと無理かも 19
まとめ Education-JAWS #5 良いLambdaライフを! 20
More Decks by takumi
See All by takumi
JAWS UG 福井誕生秘話
taku271
0
140
AIエージェントで業務改善してみた
taku271
0
670
弊社のAWS事情、大公開!
taku271
1
650
インターン生でもAuth0で認証基盤刷新が出来るのか
taku271
0
280
自社UIコンポーネントにMCPサーバーを作った話
taku271
1
150
Other Decks in Programming
See All in Programming
そのデザイントークン、Flutterでも同じ見た目になりますか?
nakamizu
0
340
ビジネスロジックを堅牢に~Scala 3のドメインプリミティブ~
j5ik2o
0
160
クラウドゲーミングのパフォーマンス最適化に挑む / Cloud Gaming Performance Tuning
vivion
0
330
オーケストレーション記述言語 Katari
yukikurage
0
260
React Native에 현대적인 빌드 도구 더하기: Rollipop 구현기
leegeunhyeok
0
180
Goコンパイラを作ってGoをもっと理解する / Build a Go compiler to better understand Go
ikura_hamu
0
130
Spec-Driven Development - Why Vaadin Is the Perfect Fit
simas
PRO
0
250
우리의 Nitro Modules는 당신의 Turbo Modules보다 아름답다
l2hyunwoo
0
260
高橋メソッドでCVE解説シリーズ 〜CVE-2026-112816〜
hakkadaikon
0
260
AI時代のTerminal環境を UNIX哲学で設計・運用する
yasunori0418
1
350
Distance field of Julia set
kinakomoti321
0
320
느린 네트워크와 저사양 디바이스 사용자를 위한 웹뷰 로딩 시간 개선기
kmkim
1
240
Featured
See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
1
660
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.9k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
330
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
320
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.6k
The Invisible Side of Design
smashingmag
301
52k
The Cult of Friendly URLs
andyhume
79
7.1k
Test your architecture with Archunit
thirion
2
2.5k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
31k
YesSQL, Process and Tooling at Scale
rocio
174
15k
Music & Morning Musume
bryan
48
7.5k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
1.1k