From Local Development to Production: Deploying TypeScript Applications in 2024

Your TypeScript code is ready to conquer the world? Time to ship it to production

You've written the perfect TypeScript application. Locally, everything runs smoothly, types are strict, code is beautiful. But as soon as the question "How do I run this on a server?" comes up, many developers freeze. Sound familiar?

Deploying TypeScript applications is not rocket science, but it's also not "just copy the folder". In this article, we'll cover three main approaches: classic VPS, modern Docker, and cloud platforms. You'll learn how to properly build a TypeScript project, configure the environment, and automate rolling out updates. Let's go!

Step 1: Preparing the TypeScript Application for Deployment

Before thinking about servers, you need to ensure your application is ready to work outside the local environment. TypeScript is a superset that compiles to JavaScript. On the server, Node.js does not understand .ts files directly (unless you use ts-node, which is not recommended for production).

Building the Project

Make sure your package.json has the correct scripts:

{\n  "scripts": {\n    "build": "tsc",\n    "start": "node dist/index.js",\n    "dev": "ts-node-dev --respawn src/index.ts"\n  },\n  "main": "dist/index.js"\n}

The npm run build command will create a dist folder with the ready JS code. This is the folder we will deploy.

Tip: add "outDir": "./dist" to tsconfig.json and configure exclude for node_modules:

{\n  "compilerOptions": {\n    "outDir": "./dist",\n    "rootDir": "./src",\n    "target": "ES2020",\n    "module": "commonjs",\n    "strict": true,\n    "esModuleInterop": true\n  },\n  "include": ["src/**/*"],\n  "exclude": ["node_modules", "dist"]\n}

Method 1: Classic VPS — Full Control

VPS (Virtual Private Server) is a rented server where you are the king and god. Suitable for projects where you need full control over the environment. Let's look at deployment on Ubuntu 22.04.

Server Setup

\n
• Connect via SSH: ssh root@your_IP
\n
• Update packages: apt update && apt upgrade -y
\n
• Install Node.js 20.x: \n curl -fsSL https://deb.nodesource.com/setup_20.x | bash - && apt install -y nodejs\n
\n
• Install PM2 — a process manager for Node.js:\n npm install -g pm2\n
\n

Application Deployment

The simplest way is to copy files via SCP or Git. I recommend Git:

git clone https://github.com/your-repository/project.git /var/www/myapp\ncd /var/www/myapp\nnpm install\nnpm run build\npm2 start dist/index.js --name "myapp"\npm2 save\npm2 startup

Important: configure Nginx as a reverse proxy so the application is accessible on port 80:

server {\n    listen 80;\n    server_name your-domain.ru;\n\n    location / {\n        proxy_pass http://localhost:3000;\n        proxy_http_version 1.1;\n        proxy_set_header Upgrade $http_upgrade;\n        proxy_set_header Connection 'upgrade';\n        proxy_set_header Host $host;\n        proxy_cache_bypass $http_upgrade;\n    }\n}

Don't forget to set up SSL via Certbot — it's free and mandatory for the modern web.

Method 2: Docker — Containerization for Reproducibility

Docker solves the main problem of VPS: "It works on my machine!". The container contains everything needed — Node.js, dependencies, built code. The environment is identical on any OS.

Dockerfile for TypeScript

We create a multi-stage build — this reduces the final image:

# Stage 1: Build TypeScript\nFROM node:20-alpine AS builder\nWORKDIR /app\nCOPY package*.json ./\nRUN npm ci\nCOPY . .\nRUN npm run build\n\n# Stage 2: Production image