Using this for Next JS app and costs?

[salvinoto]

Hi, I'm wondering if using this to deploy next js apps entirely on lambda will incur more costs than deploying static on s3 then using only lambda for server functions. It's much more difficult to do so the other way, but in my case I need the cost to be on the lower side. Thanks.

[bnusunny]

Hosting Next.js apps on Lambda (with function url or api gateway) is a bare minimum setup.

Most of the time, you will put a CDN (such as CloudFront) in front of the Lambda function, and setup a cache behavior to cache the static assets. CDN will reduce the requests to the lambda function.

Furthur more, you could copy the static assets to a s3 bucket using CI/CD pipeline when you deploy new versions, and configure the CDN to serve static assets from the s3 bucket. In this setup, all requests for static assets won't hit the lambda function.

You can choose the most suitable setup/architecture for your application.

[salvinoto]

Thank you for the advice. It sounds like a good idea to use s3 for static assets. If you're familiar with Next JS, if I deploy my app with lambda, and upload the static folder to s3, I'm assuming that if there's something that's not statically generated, it will access the lambda resource? Like if a server component doesn't exist in the static build, it will automatically use the lambda because the page or api route doesn't exist on the static? I'm essentially thinking deploy static to s3 and the entire app to lambda, and whatever doesn't exist on s3 will go to the lambda.

Edit: What I'm saying is how will it know to switch between static and lambda

[bnusunny]

Here is an example of that solution. The CloudFront distribution has two cache behaviors: one for the static resources in s3, and a default one for all other paths to the Lambda function. CloudFront will route each request based on the HTTP path.

[salvinoto]

That seems like a great example, thank you for showing me that. I'm trying to use this to deploy from GitHub automatically, and as a learning experience.