TypeScript has become a go-to tool for backend developers using Node.js — and for good reason. It brings the power of type safety, better tooling, and cleaner code to your backend, helping you catch errors early and write more scalable applications.

But let’s be honest — setting up TypeScript in a Node.js project can feel a bit tricky at first. And when it comes to deploying it on platforms like Vercel, things can get even more confusing with build settings, tsconfig tweaks, and serverless functions.

In this post, I’ll walk you through everything step-by-step:

1. ✅ How to set up TypeScript in a Node.js project.
2. ✅ How to configure it correctly.
3. ✅ And finally, how to deploy it smoothly on Vercel.

Whether you're just getting started or trying to streamline your current workflow, this guide will help you get it right.

Let’s dive in! 💡

1) Express + Typescript Boilerplate App ✏️

Create express project with typescript. You can follow the below-mentioned steps to make a boilerplate for the project. (Github repo link is provided at end of article)

1. Initialize node project

1. Install packages (you can use npm/yarn/pnpm)

1. Create tsconfig.json

To work with typescript we need to make tsconfig.json file which will help to compile and build Typescript files in plain JS. Execute below command 

npx tsc --init --rootDir src --outDir build --esModuleInterop --resolveJsonModule --lib es6 --module commonjs --allowJs true --noImplicitAny true

Once the file is created you can keep it as is, or cleanup non necessary stuff. Replace content of tsconfig.json with following :  

1.   Update scripts in package.json

1. Write express server code : Create file : src/index.ts and paste following code in it

1. Spin up server : Run yarn start or npm run start command in terminal to start express serve. You can open browser and go to localhost:8080. API will return response of Express Typescript on Vercel.

2) Initialize git in our project. 📥

1. Make a .gitignore file in the root of the folder. And add node_modules to it. If .gitignore file exists check that node_modules is added into it.
2. Execute git init in the terminal (from root of project) or you can use VS Code's source control tab to initialize git repository.
3. Connect local repo to remote (github/bitbucket). You can use any of the version control system to publish your repository.

3) Create Vercel project 🗃️

1. Go to vercel.com -> Login
2. Login using the Version control platform you have kept your repository.
3. From the dashboard -> Add new project -> Select your repository -> Deploy
4. Afer deployment you will see something similar to this! 😟

1. Don't worry... Just follow on steps to fix it. 👍

4) Add Vercel config in app ⚙️

1. In the above step, after your fist deploy is completed, you can see that we're not getting Express Typescript on Vercel response from API.
2. To work this as expected, we need to tell Vercel that is a API and you need to serve this as a serverless function.
3. For this, simply we need to add vercel.json file in root of our project. Paste below code in file.

NOTE: Check your tsconfig.json file. The value against outDir must be kept instead of dist. If your config file has any other value than dist, replace it at either of both places.  

5) Add a pre-commit hook 🏷️

1. Vercel requires plain JS source files instead of Typescript. In order to do this, we need to build the project before committing and send compiled JS files so that Vercel can parse those files and serve the API.
2. Install pre-commit and rimraf package :

1. Modify scripts field in package.json file as follows:

1. Add new field pre-commit field in package.json :

1. What this will do? → Whenever you will commit, the commands written in pre-commit will be executed. It will check Typescript errors, build the project and add build folder to the staged changes. (If you opt for manual build, don't forget to run build command to start build.)

5) Re-Deploy and Re-Check API 🔁

1. Commit the changes you have made and push the commit to GitHub. Check on vercel for the new deployment. Vercel will automatically trigger a new deployment on every push. Incase it is not started, you can manually start a deployment.
2. Once new deployment is live, you can copy the deploy URL and run in browser. You will see Express Typescript on Vercel as a API response. Hurrah 😃

1. To assure that API is working perfectly, you can also hit /ping route which will return pong 🏓 as the response.

1. To assure that API is working perfectly, you can also hit /ping route which will return pong 🏓 as the response.

Closing comments 🙋‍♂️

1. Thank you for following steps with me. Incase you find any issue in above mentioned steps, please ping in comment.
2. Github repo link for this project : Express Typescript Code