# How to Deploy a Next.js App for Free on Vercel

If you’ve built your first Next.js project and you’re wondering how to make it live on the internet good news: it’s easier than you think!

In this guide, I’ll walk you step-by-step through deploying your Next.js app to Vercel, for free.

I’m sharing this from my experience at Jossy [Code](https://t.me/jossycodeacademy) Academy where we teach beginners how to go from writing their first line of code to launching real-world projects online.

### **What You’ll Learn**

By the end of this guide, you’ll know how to:

* Push your Next.js project to GitHub
    
* Connect GitHub to Vercel
    
* Configure your deployment settings
    
* Go live with a custom domain
    

### Step 1: Push Your Project to GitHub

If you haven’t already, create a GitHub account and upload your Next.js project.

You can do this from your terminal:

> git init
> 
> git add .
> 
> git commit -m "Initial commit"
> 
> git branch -M main
> 
> git remote add origin https://github.com/yourusername/yourproject.git
> 
> git push -u origin main

### Step 2: Create a Vercel Account

Go to Vercel.com and sign up using your GitHub account.

Once logged in, click “New Project” and import your Next.js repository.

Vercel automatically detects Next.js projects, so you don’t need to configure anything manually.

### Step 3: Configure Your Build Settings

Usually, Vercel will handle this for you, but make sure your settings look like this:

Framework Preset: Next.js

Build Command: next build

Output Directory: .next

Click Deploy, and within a few seconds, your site will be live on a temporary URL like:

> https://yourproject.vercel.app

This is the fun part — you’ve just deployed your Next.js app for free!

At [Jossy Code Academy telegram channel](https://t.me/jossycodeacademy) we teach you how to take this further by adding SEO optimization, analytics, and API integrations.we teach students how to take this further by adding SEO optimization, analytics, and API integrations.

### Step 4: Add a Custom Domain (Optional)

If you have your own domain name (like learnwithjossy.com), you can connect it in your Vercel dashboard under Settings → Domains.

Just type your domain, and Vercel will guide you through updating your DNS records.

### Final Thoughts

Congratulations, your Next.js app is live!

You’ve just learned one of the most important steps in becoming a full-stack developer.

If you want to go beyond deployment and learn how to build complete web apps from scratch, join me at [Jossy Code Academy telegram channel](https://t.me/jossycodeacademy)

In the channel, we teach practical web development helping beginners build skills that actually make money online.