Decide how to deploy your Next.js App

Deciding which hosting solution to use to host your Next.js app is not an easy task. There are many providers and many options to choose from.

In this page I help you clarify which are the strengths and the weaknesses of the different options.

Managed Serverless Options

Vercel is the most obvious choice if you get started with Next.js. The framework is built by Vercel, and they provide you with the best developer experience (DX) to deploy a Next.js app.

I am personally a fun of Vercel, the way they work and interact with the community, and how simple it is to deploy an app. You simply connect your GitHub repository, and Vercel will take care of the rest (hosting, SSL, CI/CD, etc.). You can even deploy automatically on every commit.

An advantage of using Vercel, is that you always get support for the new features of Next.js. That's not something the other platforms can't guarantee from day one, and Next.js evolves quickly.

The direct competitor of Vercel is Netlify. They provide a similar service, but they are not as focused on Next.js as Vercel is. Also in terms of pricing and features, they are very similar. The user interface of Netlify is not as good as Vercel's, but still usable. The entry paid plan costs $19/month versus $20/month of Vercel.

Serverless Function Maximum Execution Duration

With Next.js each page and API endpoint is a serverless function. And serverless functions have a maximum execution time (timeout). If you exceed that timeout, the function is terminated and the user will not get the response.

If you are planning to use long running serverless functions, consider this value. For Vercel it is 300 seconds (15 minutes), while for Netlify it's only 26 seconds.

Bandwidth

Something that scares developers and product owners, is the price for the bandwidth. Both Vercel and Netlify offer 100 GB of bandwidth for free, and 1 TB on the paid plan. If you exceed that limit, you will be charged $40 per 100 GB, while Netlify charges $55 per 100 GB.

This is an important aspect to consider, if you are building a directory, or in general a website that is supposed to get a huge amount of traffic, you might consider to start with different options.

If you are building a micro-SaaS instead, you would probably never exceed the paid plan bandwidth limits.

AWS Amplify is another good alternative. The pricing model here is a bit different, you don't have a paid plan, instead you have a free tier, and when exceeded you pay as you go.

For instance you get:

• 15 GB of bandwidth per month
• 5 GB of storage per month
• 1000 build minutes per month
• 500,000 requests per month
• 100 GB-hours per month of Server Side Rendering time

On the other side, Amplify offers a much longer serverless function timeout, up to 15 minutes (the timeout of a lambda function).

If you are planning to run scheduled or long running jobs in the background, and you don't want to manage virtual machines, Defer is a greate alternative.

SSL Certificates

One important advantage of using a managed serverless option, is that you don't have to worry about SSL certificates. They are automatically generated for you. They use Let's Encrypt under the hood, and automatically renew the certificates. One less thing to think about and devote time to.

Domain names

Another advantage is that these platforms give you a domain name for free, and if you want to use your own domain name, you can easily configure it. They provide you with the DNS records to add to your favorite domain name provider.

Virtual Machine Options

Since the raise of Amazon Web Service, virtual machines have become very cheap. You can get a virtual machine for as low as $5/month.

Today there are cloud services that combine virtual machines, with easy to use platforms to deploy your app. I'm talking about Render, Fly, and Digital Ocean. They all provide simplified ways for developers to deploy their apps.

Render is particularly interesting because it comes with a free plan that is pretty generous. You get 100 GB of bandwidth, 500 minutes of pipeline per month and a machine with 512 MB an 0.1 CPUs. And it provides unlimited SSL certificates also for your custom domain, including wildcard certificates.

Render includes a continuous deployment solution, it means that you can connect your GitHub (or GitLab) repository, and when you push a new commit, Render builds and deploys the application, with zero downtime.

Fly offers 3 shared-cpu-1x VMs with 256 MB of RAM, 3 GB of storage, and 160 GB of outbound data transfer. All the resources that exceed these limits, are charged per use. Fly offers 10 free SSL certificates, and charges $0.10/month for any additional ones. While wildcard certificates cost $1/month.

You can configure a continuous deployment pipeline using GitHub Actions, which requires a bit more work compared to Render.

Digital Ocean offers a service named Droplets, that are just Linux-based virtual machines. The service starts at $4/month, which is quite cheap, but it doesn't have a free plan.

Similarly to Fly, you can configure a continuous deployment pipeline using GitHub Actions.

Finally, Hetzner is a cloud computing provider. It is particularly popular due to its cheap prices.

You can spin up a new virtual machine with 1 vCPU, 2 GB of RAM, 20 GB of disk space, and 20 TB of traffic for $5/month, while a similar machine on Amazon Web Services (AWS) EC2 costs around $20/month.

But on AWS you find smaller instance types, like the t4g.nano with 2 vCPUs, 0.5 GB of RAM and 10 TB of data transfer out per month, for around $3/month.

The main disadvantage of using pure virtual machines providers (Hetzner and AWS EC2), is that you need to handle anything by yourself: SSL certificates renewal (every 3 months with Let's Encrypt), scaling, uptime, storage resizing, and so on. While managed solutions like Render, Fly, and Digital Ocean provide managed services to handle most of that in a simpler way.

For reference, the pricing pages of all the mentioned services (in alphabetical order).

• AWS Amplify
• AWS EC2
• Digital Ocean
• Fly
• Hetzner
• Netlify
• Render
• Vercel

I hope this overview helped you decide which option is the best for you. If you have any questions, feel free to reach out on Twitter / X.

Cheers,
Luca