Next.js: aws-serverless-express and serverless example

Created on 27 May 2018  路  10Comments  路  Source: vercel/next.js

Feature request

Is your feature request related to a problem? Please describe.

Trying to host the next.js project in AWS turned out to be difficult. Is it possible to create an example with it?

Describe the solution you'd like

Example should consider scenario where express server is not initialized right away as in https://github.com/zeit/next.js/blob/canary/examples/with-react-i18next/ example

Describe alternatives you've considered

Tried adding next to https://github.com/awslabs/aws-serverless-express/tree/master/example
Also tried adding aws-serverless-express to https://github.com/zeit/next.js/tree/canary/examples/custom-server-express
Neither worked.

good first issue example

Most helpful comment

Serverless Next.js has landed in canary: https://github.com/zeit/next.js/pull/5927

All 10 comments

The readme should probably also have mild warnings that serverless solutions have max bundle size limitations that can be exceeded as your project grows. They also introduce latency that may not be optimal for consumer facing products. I tested a next.js example on AWS Beanstalk and it consistently returns in about 35ms. With AWS Lambda, it varies wildly between 150ms and 2.5s when "warm" (always fast consecutive requests but when waiting a few mins and trying again I sometimes got alot of latency).

My guess is that it is nothing to do with Next/React. I suspect the CloudFront "edge" adds ~50ms avg, the API Gateway adds around ~50ms avg, and the rest of the variation is Lambda sharing resources (and potentially not giving me priority as my testing is anecdotal rather than consistent). It would be interesting and significant to do performance testing next.js example vs next.js heavy ssr vs plain response code though. Note to those interested that you can now do "regional" API Gateway to eliminate the CloudFront edge latency but you give up http->https redirection which is important if you want to serve a public facing site. If you are willing to accept the serverless latency, most people might be better off doing regional endpoint and then putting their own CloudFront distribution in front for custom domain name, https redirect, and caching resources (need to set html response headers correctly).

FYI I believe this is the best example to date for those that want to try: https://github.com/skriems/next-material

The cold starts get longer if you are inside of a VPC as well, more overhead and services that need to be hit in order for the eventual function to be invoked

I see serverless has a Vue/Nuxt.js example, would this be a good starting point?

https://github.com/serverless/examples/tree/master/aws-node-vue-nuxt-ssr

Here is a repo of next.js working on lambda with serverless. (or, well, mostly working. I am still working on building an app around it for some internal work)

https://github.com/Prefinem/aws-lambda-serverless-nextjs

Please feel free to let me know if I am missing something or need to make any changes to support something I am not currently

Serverless Next.js has landed in canary: https://github.com/zeit/next.js/pull/5927

Will try to make a current project work with next-canary ! (I will add an example if this works as intended)
Thanks for this btw ! Nice work !

Sorry but not available for a simple serverless example. (My example will be with typescript, so not so basic after all)

@timneutkens Actually I am trying to create an example of something like this

  1. Nextjs + Serverless
  2. Use serverless-offline to get it work in dev mode with HMR
  3. Use aws-serverless-express
  4. Deploy it on AWS lambda

I have a sample repo you can have a look at.
https://github.com/kamleshchandnani/nextjs-serverless
But currently whenever I try to run it in dev mode it goes into infinite loading similar to this #2123

Maybe you can share some thoughts on it? I can then send a PR to add it to examples

Going to close this as it's had good first issue / help wanted for 1,5 year.

Was this page helpful?
0 / 5 - 0 ratings