How to deploy your Typescript backend on Render (Simple steps)

Deploying a TypeScript backend on Render can be straightforward if you follow these simple steps. In this guide, I will walk you through the process using a package.json file as an example.

Step 1: Prepare Your `package.json` File

First, ensure your package.json file contains the correct scripts for building and starting your application. Here is an example:



{
  "name": "backend",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "nodemon",
    "start": "ts-node -r tsconfig-paths/register src/index.ts",
    "build": "tsc",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "axios": "^1.7.2",
    "bcrypt": "^5.1.1",
    "compression": "^1.7.4",
    "cors": "^2.8.5",
    "dotenv": "^16.4.5",
    "express": "^4.19.2",
    "groq-sdk": "^0.5.0",
    "helmet": "^7.1.0",
    "jsonwebtoken": "^9.0.2",
    "mindsdb-js-sdk": "^2.3.0",
    "module-alias": "^2.2.3",
    "mongoose": "^8.4.4",
    "morgan": "^1.10.0",
    "nodemon": "^3.1.4",
    "openai": "^4.52.3",
    "pdf2json": "^3.1.3",
    "prettier": "^3.3.3",
    "ts-node": "^10.9.2"
  },
  "devDependencies": {
    "@types/bcrypt": "^5.0.2",
    "@types/express": "^4.17.21",
    "@types/hapi__joi": "^17.1.14",
    "tsconfig-paths": "^4.2.0",
    "typescript": "^5.5.3"
  },
  "_moduleDirectories": [
    "node_modules_custom"
  ],
  "_moduleAliases": {
    "@src": "./dist"
  }
}

In the scripts section, you need to have:

start: Command to start your server.
build: Command to build your TypeScript code.

Step 2: Run the Necessary Commands

To deploy your backend, you need to execute three commands in the Render build settings:

Install dependencies: ```sh

npm install


2. **Build the project**:
   ```sh


   npm run build

Start the server: ```sh

npm run start


### Step 3: Deploy on Render

Now, let's move on to deploying your project on Render.

#### 1. Create a New Web Service

- Go to [Render](https://render.com/) and log in to your account.
- Click on the "New" button and select "Web Service".

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/40616yes9g8h2y1vkwwk.png)



#### 2. Connect Your Repository

- Select the repository that contains your TypeScript backend project.
- Render will automatically detect the root directory of your project.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qwr11hff5a1obs0di4zu.png)



#### 3. Configure Build and Start Commands

- In the build command section, enter `npm run build`.
- In the start command section, enter `npm run start`.

Here are the configurations:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x18i8piwjsaiv8wzsw5h.png)



*Build Command*
You have to make sure you install and build your backend in `Build Command`

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w8b9t453qdvybsblcf4p.png)

*Start Command*
You have to make sure you start your server from the start command not with `nodemon` as it is the development mode.

Here I have `start": "ts-node -r tsconfig-paths/register src/index.ts` on my package.json file. 

So I used `npm run start`
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0dj8x4v8krgn8nsuo8il.png)

*Select you Instance type*

I am using free version.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8sr5xck0gwxwssh79390.png)

*Add environment variable if you have any*
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rigp44ysdqgpa202igab.png)




#### 4. Deploy

- Click the "Create Web Service" button.
- Render will start the deployment process. You can monitor the logs to see the progress.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6y10zk1o0ydq1yttem59.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2smqzhgyo7bzcx6qww41.png)

### Your deployment will start, if you have configured everything right. It will be deployed successfully.


### Final Notes

Ensure that your `build` and `start` commands in the `package.json` file are correctly defined to avoid any issues during the deployment.

Following these steps, you can successfully deploy your TypeScript backend on Render.