Деплой TypeScript приложения на VPS: пошаговое руководство

Введение: почему деплой TypeScript приложения на VPS — это правильный выбор

Разработка на TypeScript стала стандартом индустрии благодаря строгой типизации и улучшенной читаемости кода. Однако после завершения разработки встаёт ключевой вопрос: как правильно развернуть приложение на production-сервере? Деплой TypeScript приложения на VPS (Virtual Private Server) — это не просто копирование файлов. Это процесс, включающий компиляцию TypeScript в JavaScript, настройку окружения, управление процессами и обеспечение безопасности.

В этой статье мы разберём пошаговый алгоритм деплоя TypeScript приложения на VPS. Вы узнаете, как подготовить сервер, настроить сборку, запустить приложение с помощью менеджера процессов PM2 и обеспечить его доступность через Nginx. Материал рассчитан на разработчиков, которые уже имеют базовое приложение на TypeScript (например, Express.js или NestJS) и хотят развернуть его на удалённом сервере.

Шаг 1: Подготовка VPS и установка необходимого ПО

Первый этап деплоя TypeScript приложения на VPS — настройка самого сервера. Мы будем использовать Ubuntu 22.04 LTS как наиболее стабильную и популярную ОС для веб-серверов.

После подключения к серверу по SSH выполните следующие команды:

# Обновление пакетов
sudo apt update && sudo apt upgrade -y

# Установка Node.js (версия 18 или выше)
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt install -y nodejs

# Проверка версий
node -v
npm -v

# Установка Git
sudo apt install git -y

# Установка менеджера процессов PM2
npm install -g pm2

Обратите внимание: TypeScript не нужно устанавливать глобально на сервере. Он будет использоваться только на этапе сборки проекта, которая может выполняться как на локальной машине, так и на сервере через скрипты CI/CD.

Также рекомендуется настроить базовый файрвол:

sudo ufw allow OpenSSH
sudo ufw allow 'Nginx Full'
sudo ufw enable

Шаг 2: Клонирование проекта и сборка TypeScript

Теперь, когда сервер готов, перенесём код TypeScript приложения. Самый распространённый способ — клонирование репозитория через Git.

# Клонирование репозитория
git clone https://github.com/your-username/your-project.git
cd your-project

# Установка зависимостей
npm install

# Компиляция TypeScript в JavaScript
npx tsc

Важный момент: убедитесь, что в файле tsconfig.json правильно указана папка вывода. Обычно это dist или build:

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

После успешной компиляции в папке dist появится JavaScript-код, готовый к запуску. Проверьте, что приложение запускается корректно:

node dist/index.js

Шаг 3: Запуск через PM2 и настройка автозапуска

Простой запуск через node не подходит для production — при обрыве SSH-соединения процесс остановится. Для деплоя TypeScript приложения на VPS используем PM2, который обеспечивает:

• Автоматический перезапуск после падения
• Логирование ошибок и stdout
• Кластеризацию (запуск на нескольких ядрах CPU)

Создайте файл ecosystem.config.js в корне проекта:

module.exports = {
  apps: [{
    name: 'my-ts-app',
    script: './dist/index.js',
    instances: 'max',
    exec_mode: 'cluster',
    env: {
      NODE_ENV: 'production',
      PORT: 3000
    },
    error_file: './logs/err.log',
    out_file: './logs/out.log',
    merge_logs: true
  }]
};

Запустите приложение через PM2:

pm2 start ecosystem.config.js
pm2 save
pm2 startup

Команда pm2 startup создаст systemd-сервис, который будет автоматически запускать ваше приложение при перезагрузке сервера. Это критически важно для деплоя TypeScript приложения на VPS.

Шаг 4: Настройка Nginx как reverse proxy

Прямой доступ к порту 3000 (или другому, на котором работает ваше приложение) небезопасен и неудобен. Nginx будет выступать в роли прокси-сервера, принимая запросы на 80/443 порты и перенаправляя их на ваш Node.js процесс.

# Установка Nginx
sudo apt install nginx -y

# Создание конфигурационного файла
sudo nano /etc/nginx/sites-available/my-ts-app

Вставьте следующую конфигурацию:

server {
    listen 80;
    server_name your-domain.com www.your-domain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

    # Блокировка доступа к чувствительным файлам
    location ~ /\. {
        deny all;
    }
}

Активируйте сайт и перезапустите Nginx:

sudo ln -s /etc/nginx/sites-available/my-ts-app /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx

Теперь ваше TypeScript приложение доступно по доменному имени. Для добавления SSL-сертификата (HTTPS) используйте Certbot:

sudo apt install certbot python3-certbot-nginx -y
sudo certbot --nginx -d your-domain.com -d www.your-domain.com

Бонус: автоматизация деплоя с помощью Git-хуков

Чтобы не повторять шаги 2-3 вручную каждый раз, настройте автоматический деплой. На сервере создайте скрипт deploy.sh:

#!/bin/bash
cd /path/to/your/project
git pull