Деплой из браузерной IDE в Vercel или Netlify

Самый очевидный случай — машина, где установить CLI неудобно или запрещено. Chromebook, учебный компьютер или заблокированный корпоративный рабочий стол открывают вкладку браузера, но не всегда позволяют поставить Node.js, Git и CLI провайдера. Браузерная IDE уже снимает эти требования на этапе редактирования. Деплой обычно становится последним шагом, который возвращает разработчика в терминал; если оставить его в той же вкладке, цикл замыкается: проект редактируется, просматривается и публикуется без локального тулчейна. Второй случай — скорость. Лендингу, прототипу или демо для клиента адрес может понадобиться раньше, чем репозиторий или CI-пайплайн. Браузерная панель публикует текущий снимок и сообщает, где он доступен. У этого удобства есть граница. Это прямая загрузка, а не пайплайн деплоя. Она не следит за веткой, не запускает тесты и не продвигает сборки между окружениями; это задачи Git-интеграции провайдера или CI. Браузерный путь нужен для первого URL, а не для всего процесса релиза.

Диалог Deploy — тонкая панель управления поверх двух API провайдеров. Когда вы нажимаете Deploy now, GB Coder собирает тот же пакет файлов, что и Download ZIP. Это важно: второй путь упаковки, который мог бы потерять таблицу стилей или забыть внешнюю библиотеку, отсутствует. Обычный проект превращается в index.html, style.css, script.js и README. Проект React или Vue становится деревом в формате Vite: index.html, package.json, vite.config.js, .gitignore, README и исходники в src/. Сводка пакета показывает точное число файлов и размер без сжатия до того, как что-либо покинет вкладку. Vercel получает файлы как inline JSON на endpoint деплоя. Netlify получает ZIP как сырое тело запроса. Vercel собирает или отдаёт проект, а Netlify публикует загруженные файлы как ручной деплой. Сервер LadeStack в середине не участвует, и CLI на вашей машине не запускается. Браузер — клиент, провайдер — хост, токен — единственные учётные данные. «Один клик» описывает интерфейс, а не объём работы: упаковка, загрузка, удалённая обработка и TLS всё равно идут по очереди.

Пакет отличается, потому что два типа проектов требуют разного обращения. В обычном HTML/CSS/JavaScript-проекте нет package.json. Vercel получает указание не использовать фреймворк и отдаёт файлы как статический сайт. Netlify публикует ZIP как есть, и для статических файлов это тоже правильно. Устанавливать и компилировать нечего, поэтому первый деплой обычно быстрый. Проект React или Vue содержит сгенерированный package.json, конфигурацию Vite и исходники. В Vercel провайдер распознаёт Vite, устанавливает зависимости, запускает production-сборку и публикует результат. Это настоящая облачная сборка, а не симуляция в браузере, поэтому она может занять минуту и больше. Vercel использует версии из package.json, а не то, что случайно было загружено в редактор. Ручной ZIP-деплой Netlify не запускает команду сборки, поэтому то же дерево исходников Vite публикуется как загружено, без компиляции. Для React или Vue в Netlify используйте Git-интеграцию провайдера; путь в один клик от Netlify публикует только статический результат. Внешние библиотеки и настройки инъекций уже в пакете. Если сборка Vercel зависит от приватного пакета, нативного бинарника или сервиса, недоступного из её образа сборки, сборка упадёт, даже если превью работает локально. Логи покажут, какой это случай.

Оба провайдера аутентифицируются по personal access token. Это не пароль провайдера и не учётная запись GB Coder. Диалог ссылается на страницу токенов выбранного провайдера и объясняет область действия простыми словами. Токен Vercel может публиковать во все проекты, доступные учётной записи или команде; если есть токен с областью команды, используйте его. Токен Netlify действует на сайты, доступные учётной записи, поэтому считайте его общим для аккаунта, если нет более узкого варианта. Создайте токен именно для этой задачи, задайте минимально полезный срок и отзовите его, когда проект перестанет в нём нуждаться. GB Coder проверяет наличие токена и соответствие пакета локальным лимитам перед включением Deploy now. По умолчанию токен хранится только в памяти вкладки. Remember on this device — это опция: в безопасном контексте токен запечатывается AES-GCM перед записью в localStorage; иначе диалог предупреждает, что запоминание сохранит его открытым текстом. Область действия и отзыв — самые важные меры контроля.

Откройте проект и выберите Deploy на панели инструментов; на узком экране он находится в меню переполнения. По умолчанию выбран Vercel, Netlify — в одном клике. Имя проекта подставляется из текущего проекта. GB Coder переводит его в нижний регистр, заменяет недопустимые символы дефисами и показывает запрашиваемое имя хоста, например your-project.vercel.app. Вставьте токен, решите, запоминать ли его, и проверьте сводку пакета. Если число файлов или размер превышают лимит, диалог объясняет проблему и оставляет кнопку неактивной. Нажмите Deploy now. Провайдер создаёт проект или сайт, получает пакет и начинает обработку деплоя. Когда деплой готов, экран успеха показывает публичный URL, число файлов, размер загрузки, затраченное время и QR-код для открытия страницы на телефоне. Copy URL и Visit site нужны для передачи, а Build logs открывает собственное представление логов провайдера. Имена сайтов Netlify глобальны, поэтому запрошенное имя может быть занято. Тогда провайдер назначает другое, и GB Coder сообщает адрес, который действительно работает, а не тот, что вы ввели.

Индикатор проходит этапы упаковки, загрузки, сборки, защиты и готовности. В Netlify метка «сборка» означает обработку на стороне провайдера, а не команду сборки. Это отчёт клиента, а не предсказание провайдера. Процент растёт на первых двух этапах, а затем останавливается ниже 100, пока провайдер завершает удалённую обработку. Это сделано намеренно: удалённая обработка может длиться непредсказуемо, и полоса, которая мчится к 99%, просто врёт. GB Coder опрашивает провайдера каждые полторы секунды и обновляет сообщение при изменении состояния. У запроса загрузки есть таймаут две минуты. Панель перестаёт ждать после трёх минут опроса деплоя и отправляет вас в dashboard, потому что деплой может завершиться, даже когда браузер уже не смотрит. Отмена, закрытие диалога или Escape прерывают текущий запрос и цикл опроса. Если провайдер уже принял деплой, деплой может продолжиться на его стороне; проверьте dashboard, прежде чем считать отмену откатом. Логи провайдера — авторитетный источник при неудачном деплое.

Deploy again возвращает к форме; он не отправляет последний пакет немедленно. Это полезно, когда проект изменился, имя нужно поправить или токен истёк. Дальше Vercel и Netlify идут разными путями к одному адресу. Vercel создаёт деплой для названного проекта и нацеливает его на production. Повторные деплои с тем же именем проекта обновляют этот проект, а production alias предпочтительнее URL конкретного деплоя, поэтому адрес, которым вы делитесь, обычно остаётся стабильным. Netlify нужен site id, чтобы обновить существующий сайт, а не создавать новый. GB Coder хранит этот id в localStorage, привязывая его к очищенному имени сайта. Если очистить хранилище браузера, сменить браузер, изменить имя или удалить сайт в Netlify, следующий деплой не найдёт старый сайт и создаст новый. Поэтому переименование проекта Netlify может оставить прежний сайт в аккаунте. Оба провайдера хранят историю деплоев, пользовательские домены, управление доступом и откат в своих dashboard; панель GB Coder показывает только загрузку и публичный URL. Каждый деплой здесь — production-деплой; выбора branch preview или окружения нет.

Два лимита применяются до того, как запрос покинет вкладку: 900 файлов и 64 МБ несжатого содержимого. Они ниже потолков провайдеров, чтобы огромная загрузка не срывалась на середине сессии браузера. Сайту с большим количеством медиа лучше держать крупные изображения и видео в CDN или Git, а не в пакете проекта. Ошибки разделены по причине. 401 означает, что токен отклонён; 403 обычно указывает на нехватку прав для аккаунта или команды; 413 или 429 — payload слишком велик или провайдер ограничивает частоту; 422 — проект отклонён как невалидный; 5xx обычно временная ошибка. В Vercel неудачная сборка фреймворка — другое: загрузка прошла, а build упал, поэтому читайте логи, а не вставляйте новый токен. Сборка Vercel, которой нужны переменные окружения, — ещё одна граница. В диалоге нет редактора переменных. Задайте значения в настройках проекта Vercel и задеплойте снова; первая сборка может упасть до того, как появится проект, где их можно задать. У ручного ZIP-деплоя Netlify нет шага сборки, поэтому это к нему не относится. Трёхминутный лимит опроса — не неудачный деплой, а всего лишь неудачное ожидание.

Путь деплоя прямой: браузер вызывает api.vercel.com или api.netlify.com с вашим токеном. Прокси, который хранит учётные данные, нет, и аккаунт LadeStack для панели не требуется. По умолчанию токены живут только в сессии и запечатываются AES-GCM лишь тогда, когда вы выбираете запомнить их в безопасном контексте. Это защищает от читаемого токена в резервной копии профиля браузера или support-бандле, но не от вредоносного кода на том же origin, пока вкладка открыта. Используйте самый узкий доступный токен, задайте срок действия и отзовите его у провайдера, когда работа закончена. Владение следует за токеном: проект или сайт создаётся в аккаунте провайдера, которому принадлежит, по его условиям, квотам, логам и биллингу. GB Coder остаётся local-first, но деплой — это явный экспорт проекта провайдеру. Провайдер получает исходники сайта, а результат по умолчанию доступен по публичному HTTPS URL; защита паролем, SSO и пользовательские домены — функции провайдера. Сохраните ZIP или копию в GitHub, если профиль браузера — единственное другое место, где существует проект.

Используйте этот путь, когда небольшой сайт нужно быстро опубликовать: лендинг, портфолио, демо для занятия, прототип для клиентского ревью или статическая страница документации. Он подходит и тогда, когда проект уже живёт в GB Coder, а альтернатива — экспортировать ZIP, открыть терминал и настраивать CLI на чужой машине. Он плохо подходит для монорепозитория, серверного приложения с базой данных, сборки с учётными данными приватного реестра, команды, которая выпускает релизы через branch preview и согласования, или ассетов сверх лимитов загрузки. Это задачи Git-интеграции провайдера, CI-пайплайна или настольного окружения. Два подхода могут сосуществовать: черновик и итерации в браузере, исходники в GitHub, когда им нужна история, а production-сборку публикует CI. Практический порядок короткий: проверьте превью на ширине телефона, посмотрите сводку пакета, задеплойте, откройте публичный URL на втором устройстве и сохраните build log. Чтобы попробовать, откройте панель проектов на /app/projects, создайте или откройте проект и выберите Deploy. Справочник по настройке — в документации.