Vercel

Vercel is a serverless platform for static and hybrid applications built to integrate with your headless content, commerce, or database. Integrates perfectly with every Next.js project. Founded in 2015 by Guillermo Rauch. Solves a critical issue of big cloud providers like AWS - Developer Experience.

Written by:
  • Thom Krupa

    Thom Krupa

Last update: April 18, 2021
  • Vercel logo
  • JS framework: All
  • Website: vercel.com
  • Founded: 2015
  • Total raised: $163M
  • Infrastructure: AWS, GCP
  • Serverless: Node.js, Go, Python, Ruby

Last update: April 18, 2021

Creators of Next.js

Next.js works on Vercel as you’d expected it to work. That’s all I would need to say. Every single Next.js feature like Preview, Incremental Static Generation is covered. With no additional config needed.

Vercel feels very much like Apple but in the frontend world. The platform is like Macbook, and Next.js is like OS X. They fit. Maintaining the infrastructure and working on software is a great advantage and gives a next-gen user and developer experience.

Infrastructure

Vercel Global Edge Network is built on top of Amazon Web Services (AWS) and Google Cloud Platform (GCP). In practice, GCP is used only for routing in the Western Europe region, Brussels in Belgium.

Vercel Analytics

Vercel collects Real User Metrics and beautifully presents data. Instead of checking if your app is fast in the emulated environment by Lighthouse, you can check how it works for real people visiting the website.

Analytics by Vercel currently supports Next.js, Gatsby, and Nuxt projects. Works out-of-the-box if you use Next.js and Vercel to host the website. It can be enabled if you host your website somewhere else but requires a Vercel Pro plan.

Dashboard

In modern deployment platforms like Vercel, dashboard and user experience is one of the things that makes the difference. In contrast to big cloud providers AWS or GCP, Vercel Dashboard is intuitive, easy to manage and navigate. Team, env variables, billing. All you need to set up a frontend project easily is there.

Usage metrics

Usage view is a dashboard of all critical metrics. You can check if your functions fail, what CPU they use and how fast they execute.

Loading Video

Loading Video

Password protection, custom deployment domains

Some features like password protection can be quite pricey. If you need this but don’t want to pay $150/mo, Vercel might be a bummer.

Vercel Integrations

Vercel Integrations are apps that connect external services with the Vercel project. You can quickly connect PlanetScale, Fauna or Supabase as a database. Use Logaler or Logflare to analyze all your apps in one centralized place.

Vercel integrates with a couple of popular headless CMS - Contentful and Sanity. It automatically configures preview and webhooks.

All just in one click.

The new marketplace has been launched in July 2021. There are 18 integrations in total and a lot in development. This is a good sign since Vercel’s been quiet about integrations for more than 2 years. New marketplace and new apps that are coming clearly show Vercel put a new priority on it.

Vercel CLI

vercel command allows you to deploy projects straight out of your terminal quickly. Just type it, hit enter, and enjoy a new build on the cloud.

vercel dev replicates the whole Vercel deployment on your machine. You can test serverless functions locally without triggering new deploy or push changes to the repository.

To explore more options, check out the docs.

Conclusion

Vercel is a great Jamstack and serverless platform. It covers everything you need to develop a modern site or app. It’s very frontend-friendly. All you need to do is to connect the git repository and start pushing code.

Features
  • Automatic HTTPS
  • Atomic deploys. Instant, one-click rollback to any version
  • Real user metrics Analytics
  • Generous free plan
Use Cases
  • Next.js apps.
  • Static Websites. Vercel works with every Static Site Generator.
  • Serverless functions and apps.

Compare Vercel with

  • Netlify logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo
  • Gatsby Cloud logo
  • Layer0 logo