Understand that deploying to Vercel is quite easy, however, there are some setups you need to take into consideration during deployment.
Prerequisites
- NestJS Project connected and working properly locally in the development environment with PostgreSQL
- Vercel Account for deployment
- Supabase Account (we will be setting up our PostgreSQL Database here)
Let's start with the Supabase setup considering that your NestJS app is ready for deployment.
Supabase Account
Supabase is an opensource firebase alternative with full support and seamless configuration of your PostgreSQL database, and it also provides additional features such as authentication, storage, etc.
Set up a new account on Supabase and create a new project in the account.
Once the setup is completed, click on the connect button on the Home page. This will show you different options for connecting the DB to your project
Test the connection on your locals with the credentials provided to make sure everything is working perfectly well.
NOTE: Make sure the credentials are not exposed and stored in your .env file (I believe you know this already 😉)
Next, Let's set up our Vercel account and deploy the project
Vercel
Typically, Vercel is known mostly to be used for front-end app deployment, however, it can also be used to deploy backend projects.
PS: Use a suited service provider instead if you're working on a medium to large-scale project for your backend deployments.
On your Vercel account, create a new project and connect to your Git repository. Import your .env file and click the Deploy button.
Voila, that's it 🎉🎉🎉.
...
Common Issues likely encountered
# Error: No Output Directory named "public"
This is a common error because Vercel needs to know your output directory during the build process. To fix this, simply add a versel.json file and copy this:
{
"version": 2,
"builds": [
{
"src": "src/main.ts",
"use": "@vercel/node"
}
],
"routes": [
{
"src": "/(.*)",
"dest": "src/main.ts",
"methods": ["GET", "POST", "PUT", "DELETE", "PATCH", "OPTIONS"]
}
]
}
Run deployment again and that's all
...
# Error: This Serverless Function has crashed
In my case, it was because of a module not found error
...
There are several ways to fix this problem:
Method 1 (Replace all your imports with relative path)
From
import { UsersService } from 'src/users/users.service';
to
import { UsersService } from '../users/users.service';
...
Method 2 (Modify your vercel.json file and .gitignore file)
I eventually went with this method because I didn't need to confine my app to using only relative path imports.
So, modify the vercel.json to this
{
"version": 2,
"builds": [
{
"src": "dist/main.js",
"use": "@vercel/node"
}
],
"routes": [
{
"src": "/(.*)",
"dest": "dist/main.js",
"methods": ["GET", "POST", "PUT", "DELETE", "PATCH", "OPTIONS"]
}
]
}
Go to your .gitignore file and remove /dist.
Run a new deployment and that's all.
Happy coding! 😎
Top comments (6)
Hey thank you for this, I am wondering why you said to look for a suitable provider if mid to large projects, is cause vercel backends are running on vercel functions and the bill will be high for big projects ?
Hi Rraji,
Apologies for replying late.
Vercel is a deployment platform, just like AWS, GCP, or Azure, but it’s optimized for frontend and serverless workloads. It works very well for small to medium backends, especially APIs that sit close to the frontend. However, for mid to large-scale backend systems, providers like AWS, GCP, Azure, or VPS-based setups are often more suitable because they offer more control over infrastructure, cost control, and performance.
Like you said, the bill is also high for big projects based on your usage rather than the resources consumed on other providers.
tanksThank you
You're welcome
Looking for this exact kind of resource. Thanks, man.
You're welcome. Glad it helped.