Міграція з Vercel/Netlify на свій VPS: NextJS standalone

Для міграції з Vercel на свій VPS оптимально використовувати режим NextJS standalone, який дозволяє запакувати застосунок у легкий Docker-контейнер та запускати його на сервері вартістю від $10-20 на місяць, повністю виключаючи переплати за Edge Functions, пропускну здатність та оптимізацію зображень.

Економіка міграції: чому Vercel alternative VPS стає необхідністю

Vercel та Netlify — чудові інструменти для швидкого старту, але їхня бізнес-модель побудована на «податку на успіх». Як тільки ваш проєкт починає генерувати значний трафік або активно використовувати серверні функції, рахунки ростуть експоненціально. Основна причина шукати vercel alternative vps — це непрозоре ціноутворення за межами лімітів тарифного плану Pro.

Типовий кейс: проєкт на NextJS з 500,000 унікальних відвідувачів на місяць. На Vercel ви почнете платити не тільки $20 за розробника, але й за перевищення лімітів за наступними пунктами:

• Bandwidth: $40 за кожні додаткові 100 GB. На своєму VPS трафік часто або безлімітний, або коштує у 10-20 разів дешевше.
• Edge Functions: Оплата за час виконання та кількість викликів. Складна логіка в Middleware може підняти рахунок на $200-500 на місяць.
• Image Optimization: $5 за кожні 1000 додаткових оптимізованих зображень.

Коли ви розумієте, що вам нема чого платити vercel за повітря, перехід на власну інфраструктуру стає логічним кроком. Використання AWS EC2 alternative для backend у вигляді продуктивного VPS дозволяє не тільки заощадити, а й отримати передбачуваний Fixed Billing.

Self host NextJS: розбираємось з режимом standalone

Основна складність, якою лякають прихильники PaaS-рішень, — це налаштування оточення. Однак, починаючи з версії 12, NextJS підтримує режим output: 'standalone'. Це кілер-фіча для тих, хто планує self host nextjs.

У цьому режимі NextJS автоматично збирає тільки ті файли, які необхідні для роботи в production, включаючи мінімальну версію node_modules. Результат збірки — один файл server.js, який замінює собою величезну папку проєкту. Це дозволяє скоротити розмір Docker-образу з 1.5 GB до 150-200 MB.

Як включити standalone режим

У файлі next.config.js додайте наступне налаштування:

module.exports = {
  output: 'standalone',
}

Після запуску команди next build, папка .next/standalone буде містити все необхідне для запуску сервера. Вам більше не потрібно копіювати весь вихідний код на VPS, що робить процес vercel to vps максимально чистим та професійним.

Vercel to VPS: покрокова інструкція з контейнеризації

Для надійного деплою найкраще використовувати Docker. Це гарантує, що застосунок буде працювати однаково на вашій машині та на сервері Valebyte. Нижче наведено оптимізований Dockerfile для NextJS застосунку.

FROM node:20-alpine AS base

# Установка зависимостей
FROM base AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
RUN npm ci

# Сборка проекта
FROM base AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .
RUN npm run build

# Финальный образ
FROM base AS runner
WORKDIR /app
ENV NODE_ENV production
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

COPY --from=builder /app/public ./public
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static

USER nextjs
EXPOSE 3000
ENV PORT 3000
CMD ["node", "server.js"]

Цей Dockerfile реалізує multi-stage build, що критично важливо для продуктивності. Якщо ви шукаєте DigitalOcean alternative, зверніть увагу на наші тарифи з NVMe дисками — швидкість збірки образу на них буде у 2-3 рази вище за рахунок відсутності жорстких лімітів на IOPS.

Налаштування Docker Compose

Для управління контейнером та супутніми сервісами (наприклад, Redis для кешування ISR) використовуйте docker-compose.yml:

version: '3.8'
services:
  nextjs:
    build: .
    ports:
      - "3000:3000"
    environment:
      - DATABASE_URL=${DATABASE_URL}
      - NEXTAUTH_SECRET=${NEXTAUTH_SECRET}
    restart: always

Коли нема чого платити Vercel: налаштування оточення на сервері

Після того як контейнер готовий, необхідно налаштувати фронтенд-частину: веб-сервер, SSL-сертифікати та захист від атак. У Vercel це «магія» під капотом, на VPS — це 10 хвилин налаштування Nginx.

Встановлення Nginx як Reverse Proxy

Nginx буде приймати запити на 80/443 портах та перенаправляти їх у ваш Docker-контейнер. Приклад конфігурації:

server {
    listen 80;
    server_name yourdomain.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;
    }
}

Для автоматизації отримання SSL-сертифікатів використовуйте Certbot. Це безкоштовно та оновлюється автоматично, на відміну від платних опцій у деяких провайдерів. Якщо ви плануєте масштабний переїзд, вивчіть наш гайд: переїзд з AWS Lightsail/EC2 на dedicated, де детально описані нюанси налаштування мережевого стеку для високих навантажень.

Netlify alternative: хостинг статики та SSR на своєму залізі

Багато хто обирає Netlify за зручність роботи зі статикою (SSG). Однак NextJS на VPS відмінно справляється і з цим. При використанні next export ви отримуєте набір HTML/CSS/JS файлів, які Nginx може віддавати з неймовірною швидкістю без участі Node.js процесу.

Переваги VPS як netlify alternative:

1. Відсутність лімітів на форми: На Netlify форми платні після 100 сабмітів. На своєму сервері ви можете поставити простий мікросервіс на Go або Python.
2. Custom Headers: Повний контроль над Cache-Control, Security Headers і CORS без правок в YAML-конфігах платформи.
3. Близькість до БД: Якщо ваша база даних знаходиться в тому ж дата-центрі (наприклад, в Valebyte), затримка (latency) при SSR буде складати <1ms, тоді як функції Vercel можуть знаходитися в іншому регіоні.

Для тих, хто звик до Managed-рішень, існує Managed hosting альтернатива, яка поєднує в собі зручність панелі управління і низьку вартість оренди сервера.

Безпека та масштабування: Cloudflare Tunnel і балансування

При переході на vercel alternative vps важливо не забути про безпеку. У PaaS-рішеннях ви захищені їх інфраструктурою. На своєму сервері ви — господар ситуації.

Cloudflare Tunnel: приховуємо сервер від сторонніх очей

Замість того щоб відкривати 80 і 443 порти всьому світу, можна використовувати cloudflared. Це створює тунель між вашим VPS і мережею Cloudflare. Плюси:

• Сервер не має публічного IP, доступного для сканерів портів.
• Безкоштовний захист від DDoS.
• Автоматичний SSL «з коробки».

Масштабування NextJS додатків

Якщо одного сервера стає мало, NextJS standalone дозволяє легко горизонтально масштабуватися. Ви можете запустити 5 однакових VPS і поставити перед ними балансувальник навантаження (Load Balancer). Оскільки сесії в NextJS зазвичай зберігаються в JWT або зовнішньому Redis, проблем зі станом (state) не виникне.

Автоматизація деплою: CI/CD без зайвих витрат

Головний аргумент проти VPS — «на Vercel я просто роблю git push». На своєму сервері можна налаштувати аналогічний процес за 15 хвилин за допомогою GitHub Actions.

Приклад workflow для автоматичного деплою:

name: Deploy to VPS
on:
  push:
    branches: [ main ]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v2
      - name: Build and push Docker image
        run: |
          docker build -t my-next-app .
          docker save my-next-app | ssh user@vps "docker load"
      - name: Restart container
        run: |
          ssh user@vps "docker-compose up -d"

Такий підхід забезпечує Zero Downtime Deployment. Поки новий контейнер збирається і запускається, старий продовжує обслуговувати трафік. Це робить self host nextjs таким же зручним, як і використання дорогих хмарних платформ.

Оптимізація продуктивності: кешування і Sharp

Одна з прихованих витрат Vercel — Image Optimization. На своєму VPS вам потрібно переконатися, що бібліотека sharp встановлена коректно. NextJS використовує її для стиснення зображень на льоту.

У Dockerfile обов'язково повинна бути встановлена sharp, щоб уникнути використання повільного fallback-рішення на JS. Це дозволяє обробляти тисячі зображень в секунду, завантажуючи CPU вашого сервера, а не гаманець.

Також важливо налаштувати кешування для ISR (Incremental Static Regeneration). За замовчуванням NextJS зберігає кеш у файловій системі. У розподіленому середовищі краще використовувати плагін для Redis, щоб всі інстанси додатка бачили актуальний кеш сторінок.

Висновки

Перехід з Vercel або Netlify на власний VPS — це зріле рішення для проекту, що вийшов зі стадії MVP, що дозволяє скоротити витрати на хостинг в 10-15 разів. Для успішної міграції достатньо використовувати NextJS в режимі standalone, упакувати його в Docker і налаштувати автоматичний деплой через GitHub Actions на надійні сервери Valebyte.