"If a worker wants to do his job well, he must first sharpen his tools." - Confucius, "The Analects of Confucius. Lu Linggong"
Front page > Programming > Deploying NestJS Application using Vercel and Supabase

Deploying NestJS Application using Vercel and Supabase

Published on 2024-11-12
Browse:868

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.

Deploying NestJS Application using Vercel and Supabase

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

Deploying NestJS Application using Vercel and Supabase

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.

Deploying NestJS Application using Vercel and Supabase

Voila, that's it ???.
...

Common Issues likely encountered

# Error: No Output Directory named "public"

Deploying NestJS Application using Vercel and Supabase

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

Deploying NestJS Application using Vercel and Supabase

In my case, it was because of a module not found error

Deploying NestJS Application using Vercel and Supabase

...
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! ?

Release Statement This article is reproduced at: https://dev.to/abayomijohn273/deploying-nestjs-application-using-vercel-and-supabase-3n7m?1 If there is any infringement, please contact [email protected] to delete it
Latest tutorial More>

Disclaimer: All resources provided are partly from the Internet. If there is any infringement of your copyright or other rights and interests, please explain the detailed reasons and provide proof of copyright or rights and interests and then send it to the email: [email protected] We will handle it for you as soon as possible.

Copyright© 2022 湘ICP备2022001581号-3