-50% CODE

BLOOM50

|
-50% CODE

BLOOM50

|
Back to Blog

How to Deploy Next.js Apps to Vercel in 5 Minutes

How to Deploy Next.js Apps to Vercel in 5 Minutes

Deploying your Next.js app doesn’t need to be complicated. With Vercel, the official platform from the creators of Next.js, you can go live in under 5 minutes — with automatic builds, previews, and global CDN included.

In this step-by-step guide, we’ll walk you through how to deploy your Next.js project to Vercel using GitHub. Whether you're building a SaaS app or a personal portfolio, you'll be live and online in no time.

1. Prepare Your Next.js App

Before deploying, make sure your app is ready:

  • It should be built with the official Next.js framework.
  • You should have your code pushed to a GitHub repository.

If you haven’t pushed your project yet:

git init git add .

git commit -m "Initial commit"

git branch -M main

git remote add origin https://github.com/your-username/your-repo.git

git push -u origin main

Make sure your app runs locally without errors:

npm run dev

If you’re using app/ directory (Next.js 13+), or custom next.config.js, no worries — Vercel handles both seamlessly.

2. Deploy to Vercel from GitHub

Now that your code is on GitHub, let’s deploy:

  1. Go to vercel.com and sign in using GitHub.
  2. Click “Add New Project”.
  3. Select the GitHub repo that contains your Next.js app.
  4. Vercel will auto-detect that it’s a Next.js project — no config required.
  5. Click “Deploy” and wait a few seconds.

And that’s it! 🎉 You’ll get a live URL like:

https://your-app-name.vercel.app

Every time you push changes to GitHub, Vercel will auto-deploy your app. You also get preview deployments for each pull request.

3. (Optional) Add a vercel.json Config File

If you need advanced customization (routes, redirects, env variables), create a vercel.json file at your project root:

{ "rewrites": [ { "source": "/old-route", "destination": "/new-route" } ] }

You can also set environment variables directly from the Vercel dashboard under Project Settings → Environment Variables.

Final Thoughts

Deploying a Next.js app to Vercel is fast, reliable, and beginner-friendly. With automatic GitHub integrations, global edge networks, and zero-config builds, it’s the go-to platform for modern web apps.

If you're building a product, portfolio, or MVP, deploying early and often is key — and Vercel makes that effortless.

Ready to Build Something Amazing?

Skip the design phase and jumpstart your project with our premium Next.js templates. Production-ready, fully customizable, and built with modern best practices.

Browse Templates