WhoBuilt

Self-Hosting Next.js

Oct 8, 2024· 45 min· 134K views·Watch on YouTube

Lee Robinson, developer and head of developer experience at Vercel, explains how to self-host Next.js on a VPS, using a DigitalOcean server as the example.

Choose and prepare a server

Robinson sets out a deployment using a Next.js app, PostgreSQL, Nginx, and Docker on a VPS advertised at $4 per month. He compares VPSs with dedicated servers and explains the trade-offs in cost, control, performance, and reliability. On the smallest server, 512 MB of memory proved tight, so he added swap space to help builds complete.

Deploy with Docker and Nginx

A Bash script installs Docker and Docker Compose, prepares the server, clones the app, creates environment variables, configures Nginx and SSL with Certbot, and starts the containers. The example runs the app, PostgreSQL, and a cron service in separate containers, connected through Docker Compose. Robinson recommends Next.js standalone output to reduce the Docker image size by about 80%, and notes that Docker makes the deployment portable to other infrastructure.

Configure Next.js features for self-hosting

The demo shows server-rendered data, image optimization, streaming with Suspense, PostgreSQL CRUD actions, ISR, middleware, environment variables, startup instrumentation, cron, and Nginx rate limiting. For streaming, Nginx proxy buffering is disabled and compression is handled by Nginx. Next.js uses an in-memory cache by default on a single container, while a custom cache handler can use durable storage such as Redis.

Scale or use managed services

Robinson describes scaling from one VPS running the app, database, and cron to separate services and, at larger scale, Kubernetes with multiple Next.js containers. He presents managed platforms such as Vercel as a way to offload routing, TLS, caching, image optimization, and scaling, while self-hosting trades cost savings and control against operational work. Other options include static export, community adapters, Coolify, and Kamal.

Takeaways

  • A small VPS can run a Next.js app and database, but limited memory may require swap space or a larger server.
  • Use Docker Compose to package the app, database, and supporting services in a portable deployment.
  • For streaming through Nginx, disable proxy buffering and let Nginx handle compression.
  • The default ISR cache is in memory on one container; use a custom cache handler for shared or durable storage.
  • Choose self-hosting when you value infrastructure control and can own its operations; managed services reduce that work.

Mentioned in this talk

Search inside this talk

What was claimed 5

  • feature
    DigitalOcean: Offers a $4-a-month VPS
    “I didn’t know they offered a $4-a-month VPS.”
    YouTube
    Unverified1 source· Talk
  • feature
    Next.js: Standalone output can reduce Docker image size by about 80%
    “This helps reduce the output size of your Docker image by about 80%.”
    YouTube
    Unverified1 source· Talk
  • feature
    Next.js: Next.js 15 no longer requires manually installing Sharp for image optimization
    “In Next.js 15, we made it so that you don’t have to manually install Sharp on your server.”
    YouTube
    Unverified1 source· Talk
  • feature
    Vercel: Provides globally distributed points of presence, managed Kubernetes, firewall, routing, caching, compute, image optimization, and object storage
    “There are hundreds of points of presence around the world.”
    YouTube
    Unverified1 source· Talk
  • feature
    Vercel: Offers a free tier and a $20-a-month tier
    “It has a free tier and a $20-a-month tier if you want to scale even further.”
    YouTube
    Unverified1 source· Talk

Related talks