Чтобы развернуть frontend-приложение, перейдите в раздел «App Platform» и нажмите кнопку «Создать» или «Добавить».
Шаг 1. Выбор приложения
В пункте «Тип» выберите вкладку «Frontend», затем нужный фреймворк и версию Node.js, необходимую для работы вашего приложения.
Шаг 2. Подключение репозитория и выбор ветки
Вы можете подключить репозиторий:
-
Из своего аккаунта GitHub, GitLab или BitBucket. Кликните на название платформы, авторизуйтесь и выберите нужный репозиторий. Если вы уже авторизованы, панель сразу покажет доступные репозитории.
-
По URL — укажите ссылку на репозиторий, созданный на любой платформе. Кликните «Подключите git-репозиторий по URL» (либо «Добавить аккаунт» → «Подключите git-репозиторий по URL») и укажите Git URL репозитория. Если репозиторий приватный, введите реквизиты доступа.
Подробнее о подключении репозиториев — здесь.
Выберите ветку для деплоя.
Если вы подключаете репозиторий через аккаунт, опция «Сборка по последнему выполненному коммиту» будет включена по умолчанию. В этом случае App Platform выполнит деплой по последнему коммиту и в дальнейшем будет автоматически пересобирать приложение при появлении новых коммитов в репозитории.
При необходимости вы сможете отключить автодеплой в дальнейшем.
Если вы хотите выбрать конкретный коммит вручную, отключите эту опцию.
Шаг 3. Регион
Выберите регион размещения сервера.
Шаг 4. Конфигурация
Для всех frontend-приложений выделяется 2 ГБ NVMe-диска. Выбор конфигурации сервера не предусмотрен — для приложений — для приложений действует поресурсная тарификация.
Шаг 5. Настройка приложения
На этом этапе вы можете задать команду сборки, установить необходимые зависимости, указать директорию проекта, директорию сборки и задать переменные окружения.
Команда сборки и директория сборки
Сервис автоматически предложит команду и директорию сборки для вашего проекта. При необходимости вы можете их отредактировать, однако в большинстве случаев изменения не требуются.
Параметр «Директория сборки» не меняет директорию, из которой выполняется команда сборки. Он указывает путь (относительно корня репозитория) к директории, в которой будут находиться собранные файлы, например, index.html.
Зависимости
В разделе зависимостей можно указать системные пакеты, которые необходимы, например, для сборки проекта. Все перечисленные пакеты будут переданы в команду apt install. Если пакетов несколько — укажите их через пробел.
Директория проекта
По умолчанию команда сборки запускается в корне репозитория. Если файлы вашего проекта, включая package.json, размещены в поддиректории (например: /apps/frontend), укажите путь к ней относительно корня в поле «Путь до директории проекта».
При указании пути:
- Рабочая директория переключается на указанную папку.
- Зависимости устанавливаются из файлов проекта в этой папке.
- Команды сборки и запуска также выполняются из этой папки.
Переменные
Вы можете задать переменные окружения, если это требуется для вашего проекта.
Все параметры можно изменить позже и перезапустить деплой с новыми настройками.
Шаг 6. Информация о приложении
Укажите имя приложения и при необходимости добавьте комментарий. Эти данные будут отображаться в панели управления.
Также выберите проект, в который нужно добавить приложение.
Эти настройки также можно изменить в дальнейшем.
Шаг 7. Деплой
Нажмите «Заказать». Как только процесс начнется, на вкладке «Деплой» появится лог.
Если во время деплоя произойдет ошибка, в логе отобразится ее причина. Лог будет автоматически проанализирован нейросетью, и вы увидите список возможных причин возникновения ошибки.
После завершения деплоя статус приложения обновится, а в логе появится сообщение об успешном завершении.
Технический домен, привязанный по умолчанию, отображается на главной странице раздела «App Platform».
Также его можно найти во вкладке «Настройки» конкретного приложения.
Собственный домен можно привязать по нашей инструкции.
В дальнейшем App Platform будет отслеживать обновления в репозитории и, если включен автодеплой, автоматически перезапускать проект с новыми изменениями.