Serverless

Vercel

A frontend platform from the creators of Next.js: Git deploys, a preview for every PR, serverless functions and edge.

Official site

What it is

Vercel (formerly ZEIT, 2015) is a hosting platform for frontend and full-stack apps. You connect a Git repository, every push is built and published, and every pull request gets its own preview URL.

The company created and develops Next.js, so support for that framework is the deepest: SSR, ISR, Server Components, Image Optimization. Nuxt, SvelteKit, Astro and others are supported too.

Backend code runs as serverless functions and edge functions. Blob storage and Postgres integrations are available through the Marketplace. The platform is very convenient, but cost grows at high traffic, so watch the limits.

Use it when

  • A Next.js app that needs the simplest possible deploy.
  • The team values a preview for every PR and a fast review cycle.
  • A site with variable traffic where you do not want to manage servers.
  • Prototypes and marketing sites with variable load.

Avoid it when

  • Large traffic or lots of outbound data: bills can grow quickly.
  • Long background jobs, WebSocket servers and other persistent processes.
  • You need full vendor independence: some Next.js features work best on Vercel specifically.

Key concepts

Preview deployment
A separate URL for each branch or pull request that you can show to teammates and the client.
Serverless Functions
Backend code that runs per request and scales automatically.
Edge Network
A global network that caches static assets and runs edge code close to users.
ISR
Incremental Static Regeneration: a page is generated statically and refreshed in the background on a timer or an event.
Environment variables
Separate variables for Production, Preview and Development, so secrets stay out of code.

Example

vercel.json: function region and a daily cron.

Interview questions

  1. 1. What is a preview deployment and why is it useful?

    For each branch or pull request Vercel creates a separate build with a unique URL. This lets you check a change on a live environment before merging and show it to the client.

  2. 2. How do serverless and edge functions differ?

    Serverless functions run in a chosen region and support full Node.js. Edge functions run closer to the user on a light runtime, start faster but have fewer APIs.

  3. 3. What risks should you avoid on Vercel?

    Dependence on platform-specific features and unexpectedly large bills for traffic or execution. Set spend limits and use caching.

Comparisons with this technology

Related technologies

Logos belong to their owners and are used for identification only. Icons: Simple Icons (CC0), Devicon (MIT).

Explore the platform