The Complete Guide to Deploying NestJS Application on Render

For deploying server-based practice projects, Heroku was the go-to platform. It offered a generous free tier along with a free managed Postgres database. However, with the elimination of Heroku's free tier, there has been a shift in the landscape of hosting options. Developers are now exploring alternative platforms to host their hobby and demo projects at no cost. One such Heroku alternative for deploying server-based projects is Render.

Render is a cloud platform that enables you to host static websites, web apps, APIs, databases, and even cron jobs. It offers a viable substitute for Heroku's free tier, enabling hobbyists to effortlessly host demonstration projects by linking them to their GitHub repositories.

In this article, you will learn, step by step, how to deploy a NestJS server application that utilizes Postgres as its database on the Render platform.

Create an account on Render

To deploy your NestJS application on Render, the initial step involves creating an account on the platform. You can achieve this by linking your GitHub, GitLab, or Google account. Alternatively, you have the option to register by entering your email address and selecting a password.

Personally, I find it more convenient to create an account through my GitHub credentials.

After successfully registering, you will receive a verification email in your inbox. Proceed to verify your email address and then log in to your Render account. Once logged in, the platform will direct you to the dashboard page.

Setting up a Postgres database on Render

On the Render dashboard page, click the New PostgresSQL button under the PostgresSQL card.

You will be presented with a page to set up the database.

To configure the Postgres database, provide the following details:

• Name: In this field, assign a name to the Postgres instance.
• Database: Indicate a name for the database, or one will be generated automatically.
• User: Specify a user for the database, or alternatively, a user will be generated automatically.

After completing these details, proceed to click the "Create Database" button. This action will initiate the setup of a Postgres instance within your Render account.

Deployment Prep

Before deploying your NestJS application on Render, there are a few adjustments that you should implement:

• Within your package.json file, transfer @nestjs/cli from the devDependency section to the dependency section. Following this change, execute npm install.
• In the script segment of your package.json, verify that the command designated for launching the application within a production environment is configured as start:prod: node dist/main.

Create a web service

On the dashboard page, click the New Web Service button under Web Services to create a new web service. You will then be prompted to connect your GitHub or GitLab account. Alternatively, you can connect to a public Git repository by specifying the repository URL.

Connect your repository by selecting the Git provider you use, whether GitHub or GitLab. Assuming you are using GitHub, you will be prompted to install Render on your GitHub account.

Select the Configure option to initiate the repository setup process for Render. Subsequently, you will have the choice to pick the repository that you want to configure for Render. You can opt to provide Render access to all of your repositories or exclusively to a specific repository. I prefer to grant Render access to just the repository that I want to deploy.

After you have selected the repository to deploy, click the Install button to save the configuration.

You will then be redirected back to your Render dashboard. On the dashboard, you should see the repository that you granted access to Render. Click a Connect button on the repository listing to complete the web service setup.

You will be presented with a page where you will fill out details about your web service.

Some of the fields on the page have been pre-filled. However, for the following fields, you will need to input the values that are required for your project:

- Name

For this field, choose a name for your web service. This name will be used to create the live URL that will be used to access your project once it is successfully deployed.

- Branch

You can choose what branch of your repository to deploy.

- Build Command

For this field, input the command you use to install project dependencies and compile your project's resources. If you are using NPM as a package manager for your project, the build command will be npm install && npx @nestjs/cli build. This command installs the dependencies for the project and compiles the Typescript files to Javascript.

- Start command

Here, you will input the command to run the compiled Javascript files. Typescript files are compiled into Javascript files, which by convention, are usually found in the dist folder. The start command will be the command in your package.json that you use in running the compiled application. In the script section of your package.json, it will be a key-value pair like this: start:prod: node dist/main. Enter npm run start:prod as the build command.

Adding ENV variables

Still, on the web service setup page, click on the Advanced button to open a pane where you can add your environment variables. Remember to add details of the Postgres database you previously created as env variables if your project has a Postgres database dependency.

📌 Note

Render uses Node 14.17.5 by default. If your application was developed using a version other than this, there is a possibility of encountering errors. To avoid this, enter the Node version for your application as an ENV variable on Render. Set the variable like this:

NODE_VERSION : your_app_node_version

Once, you have completed filling out the fields, click on the Create Web Service button to deploy your NestJS application. Once your service successfully deploys, you will be presented with a terminal showing logs from your application.

Conclusion

Congratulations on learning how to deploy a NestJS application to Render successfully. In conclusion, by following the steps outlined in this guide, you've gained the ability to deploy your NestJS application on Render smoothly. With its straightforward setup process, seamless integration with repositories, and support for various project types, Render is an excellent alternative for hosting your server-based projects. Happy deploying!