Disputa

Vercel

Как развернуть фронтенд или Next.js на Vercel через GitHub Actions.

Vercel подходит для фронтенда, Next.js и лёгких API. Каждый запрос выполняется как отдельная функция, поэтому сервер не работает постоянно и не засыпает, как на Render. Если нужны контейнеры, база или долгие задачи, возьмите Render или свой сервер.

Подключить репозиторий кнопкой на сайте Vercel у команды не получится: для репозитория организации нужно быть её участником, а у вас доступ только к самому репозиторию. Поэтому развёртывание идёт через GitHub Actions, от организатора ничего не нужно.

Актуальная документация Vercel: GitHub Actions, ограничения функций, бесплатный тариф, подключение GitHub.

Как развернуть

  1. Зарегистрируйтесь на Vercel и поставьте его CLI: npm install --global vercel.
  2. В папке проекта выполните vercel link и создайте новый проект. В папке появится .vercel/project.json, в репозиторий его не добавляйте.
  3. Возьмите из этого файла orgId и projectId, а на странице токенов создайте токен.
  4. Сохраните всё в секреты репозитория: VERCEL_ORG_ID, VERCEL_PROJECT_ID, VERCEL_TOKEN.
  5. Переменные приложения задайте в настройках проекта на Vercel, раздел Environment Variables.
  6. Добавьте в репозиторий файл .github/workflows/vercel.yml:
name: Vercel
on:
  push:
    branches: [main]
env:
  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
  VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm install --global vercel@latest
      - run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_TOKEN }}
      - run: vercel build --prod --token=${{ secrets.VERCEL_TOKEN }}
      - run: vercel deploy --prebuilt --prod --token=${{ secrets.VERCEL_TOKEN }}

После слияния в main ход сборки виден во вкладке Actions репозитория. Если проект лежит не в корне, укажите папку в настройках проекта на Vercel, поле Root Directory.

В адрес стенда впишите основной адрес проекта вида имя.vercel.app, а не ссылку на отдельную сборку: такие ссылки могут требовать входа.

Что учесть на бесплатном тарифе

  • Запрос живёт не дольше 5 минут. Длинный ответ модели или расчёт вынесите в отдельный сервис.
  • Тело запроса и ответа не больше 4,5 МБ. Большие файлы загружайте напрямую в хранилище.
  • Данные держите во внешней базе. Между запросами функция ничего не хранит.
  • Тариф только для личных некоммерческих проектов. Если проект станет коммерческим, тариф придётся сменить.

На этой странице