Deploy your app on Vercel

Now it's time to take your app live.

After reviewing your app’s logo, meta info, and overall setup, it’s time to bring your product online. In this step, you’ll deploy your website to Vercel — making it accessible to real users on the internet. With just a few simple steps, your app will be live, secure, and production-ready.

1. Push Your Code to Git

This step was done on this step. If you haven't pushed code into the Gitlab yet, you can follow the link above to get stated.

2. Go to Vercel and Sign In

Visit vercel.com, sign in (or sign up), and connect your GitLab provider.

Vercel allows you to connect with remote repositories like GitHub or GitLab.

You simply connect your app’s source code from GitLab, and Vercel will handle the deployment for you — it's fast, simple, and efficient.

3. Import Your Project

Click "New Project" then click "Project" button:

Then select your repo (Vercel will get repo info from Gitlab):

Vercel will auto-detect that it's a Next.js app.

4. Set Environment Variables

If your app uses .env values (e.g. MongoDB, API keys), enter them under Environment Variables before deploying.

You can copy all file .evn.local:

json
AUTHOR_NAME="your name"
BRAND_NAME="your app name"
DOMAIN="your app domain"

MONGO_DB_URI="xxxxxxxxxxxxxxxx"

MAILGUN_API_KEY="xxxxxxxxxxxxxxxx"
MAILGUN_DOMAIN="xxxxxxxxxxxxxxxx"

GOOGLE_CLIENT_ID="xxxxxxxxxxxxxxxx"
GOOGLE_CLIENT_SECRET="xxxxxxxxxxxxxxxxJ"

NEXTAUTH_SECRET="xxxxxxxxxxxxxxxx"
NEXTAUTH_DEBUG="xxxxxxxxxxxxxxxx"
NEXTAUTH_URL="<your_app_domain>"

HUBSPOT_ID="xxxxxxxx"

Then paste into the key field, Vercel will automatic add all environment variables:

You can see like that (you do not need copy and paste every variables, it will take a lot of time):

The value MONGO_DB_URI you saved on the previous step.

🔒 Note:

The environment variables you set on Vercel should be for production, not development. For example, your MongoDB connection string should point to your production database (e.g. hosted on MongoDB Atlas), not your local database.

Similarly, variables like NEXT_PUBLIC_DOMAIN or API keys may differ from those used in local development. Be sure to double-check each value to avoid unexpected issues in production.

5. Click "Deploy"

Vercel will build and deploy your app automatically. This usually takes under a minute.

6. Visit Your Live App

After deployment finishes, Vercel gives you a live URL (e.g. https://your-app.vercel.app) — your app is now live!