---
title: "Деплой frontend-приложений в облачном сервисе App Platform"
---

# Деплой frontend-приложений

> Полный индекс документации для ИИ-агентов: [llms.txt](https://timeweb.cloud/llms.txt).

Чтобы развернуть frontend-приложение, перейдите в раздел «App Platform» и нажмите кнопку «Создать» или «Добавить».

## Шаг 1. Выбор приложения

В пункте «Тип» выберите вкладку «Frontend», затем нужный фреймворк и версию Node.js, необходимую для работы вашего приложения.

![Scr 20260127 Kqtg](https://content.timeweb.com/assets/f3fbb000-4d9e-4f43-b179-4e4aeeb878fb.png?width=1050&height=986)

## Шаг 2. Подключение репозитория и выбор ветки

Вы можете подключить репозиторий:

-   **Из своего аккаунта GitHub, GitLab или BitBucket**. Кликните на название платформы, авторизуйтесь и выберите нужный репозиторий. Если вы уже авторизованы, панель сразу покажет доступные репозитории.
    
-   **По URL** — укажите ссылку на репозиторий, созданный на любой платформе. Кликните «Подключите git-репозиторий по URL» (либо «Добавить аккаунт» → «Подключите git-репозиторий по URL») и укажите Git URL репозитория. Если репозиторий приватный, введите реквизиты доступа.
    

Подробнее о подключении репозиториев — [здесь](https://timeweb.cloud/docs/apps/connecting-repositories).

![Scr 20260127 Kqzx](https://content.timeweb.com/assets/16d30409-a1fb-49d6-8dc7-421635a2c5f3.png?width=1058&height=1068)

Выберите ветку для деплоя.

В меню выбора ветки отображаются только 200 последних веток. При подключении репозитория GitLab, GitHub или Bitbucket также отображается ветка по умолчанию (`master`, `main` или `default`).

Если вы подключаете репозиторий через аккаунт, опция «Сборка по последнему выполненному коммиту» будет включена по умолчанию. В этом случае App Platform выполнит деплой по последнему коммиту и в дальнейшем будет автоматически пересобирать приложение при появлении новых коммитов в репозитории.

При необходимости вы сможете [отключить автодеплой](https://timeweb.cloud/docs/apps/upravlenie-apps-v-paneli#avtodeploj) в дальнейшем. 

Если вы хотите выбрать конкретный коммит вручную, отключите эту опцию.

## Шаг 3. Регион

Выберите регион размещения сервера.

![Scr 20260127 Krcz](https://content.timeweb.com/assets/a57cfd68-b2b1-45d4-bf49-23e8ee1aa9dd.png?width=1088&height=648)

## Шаг 4. Конфигурация

Для всех frontend-приложений выделяется 2 ГБ NVMe-диска. Выбор конфигурации сервера не предусмотрен — для приложений [действует поресурсная тарификация](https://timeweb.cloud/docs/apps/frontend-pricing).

![Scr 20260127 Kreq](https://content.timeweb.com/assets/bc813d23-8079-45a4-9e20-9cb28be58045.png?width=1046&height=296)

Для приложений [Nuxt](https://timeweb.cloud/docs/apps/deploying-frontend-apps/nuxt) и [Next.js](https://timeweb.cloud/docs/apps/deploying-frontend-apps/nextjs) вы можете включить поддержку SSR — тогда станет доступен выбор конфигурации сервера, аналогично [бэкенд-приложениям](https://timeweb.cloud/docs/apps/deploying-backend-applications).

![6d47cd9d 3d6b 4e42 Abd0 2a6d9a51142c](https://content.timeweb.com/assets/5c71246d-880d-4728-beb9-65fc9da2e770.png?width=1036&height=804)

## Шаг 5. Настройка приложения

На этом этапе вы можете задать команду сборки, установить необходимые зависимости, указать директорию проекта, директорию сборки и задать переменные окружения.

![96bc7e53 5f16 44c7 9914 05f3572c7b81](https://content.timeweb.com/assets/0e2d54fc-683d-4cb7-a401-aa55217ff1e4.png?width=660&height=624)

#### Команда сборки и директория сборки

Сервис автоматически предложит команду и директорию сборки для вашего проекта. При необходимости вы можете их отредактировать, однако в большинстве случаев изменения не требуются.

Параметр «Директория сборки» не меняет директорию, из которой выполняется команда сборки. Он указывает путь (относительно корня репозитория) к директории, в которой будут находиться собранные файлы, например, `index.html`.

Если одновременно указаны «Путь до директории проекта» и «Директория сборки», итоговый путь, из которого будут отдаваться файлы сайта, формируется как:

```shell
Путь до директории проекта + Директория сборки
```

Например, если указано:

-   Путь до директории проекта: `/apps/frontend`
    
-   Директория сборки: `dist`
    

то файлы будут браться из директории `/apps/frontend/dist`.

#### Зависимости

В разделе зависимостей можно указать системные пакеты, которые необходимы, например, для сборки проекта. Все перечисленные пакеты будут переданы в команду `apt install`. Если пакетов несколько — укажите их через пробел.

#### Директория проекта

По умолчанию команда сборки запускается в корне репозитория. Если файлы вашего проекта, включая `package.json`, размещены в поддиректории (например: `/apps/frontend`), укажите путь к ней относительно корня в поле «Путь до директории проекта».

При указании пути:

-   Рабочая директория переключается на указанную папку.
-   Зависимости устанавливаются из файлов проекта в этой папке.
-   Команды сборки и запуска также выполняются из этой папки.

#### Переменные

Вы можете [задать переменные окружения](https://timeweb.cloud/docs/apps/variables), если это требуется для вашего проекта.

Все параметры можно [изменить позже](https://timeweb.cloud/docs/apps/upravlenie-apps-v-paneli#smena-parametrov-i-novyj-deploj) и перезапустить деплой с новыми настройками.

## Шаг 6. Информация о приложении

Укажите имя приложения и при необходимости добавьте комментарий. Эти данные будут отображаться в панели управления.

Также выберите проект, в который нужно добавить приложение.

![Scr 20260127 Krlt](https://content.timeweb.com/assets/9545896f-ec75-4884-9fe6-f734f8ec9241.png?width=1086&height=670)

Эти настройки также можно изменить в дальнейшем.

## Шаг 7. Деплой

Нажмите «Заказать». Как только процесс начнется, на вкладке «Деплой» появится лог.

Если во время деплоя произойдет ошибка, в логе отобразится ее причина. Лог будет автоматически проанализирован нейросетью, и вы увидите список возможных причин возникновения ошибки.

После завершения деплоя статус приложения обновится, а в логе появится сообщение об успешном завершении.

![Scr 20260127 Kspd](https://content.timeweb.com/assets/90f8613e-ffa7-403b-8448-2f332d6a7377.png?width=2202&height=1664)

Технический домен, привязанный по умолчанию, отображается на главной странице раздела «App Platform».

![Scr 20260127 Ksrv](https://content.timeweb.com/assets/0c874c39-8739-4f49-9b11-ac649b4afa73.png?width=2174&height=1556)

Также его можно найти во вкладке «Настройки» конкретного приложения.

![Scr 20260127 Ktbk](https://content.timeweb.com/assets/169c44a2-b63d-41f6-bb98-4165a08e3303.png?width=2172&height=1454)

Собственный домен можно привязать [по нашей инструкции](https://timeweb.cloud/docs/apps/upravlenie-apps-v-paneli#privyazka-domena).

В дальнейшем App Platform будет отслеживать обновления в репозитории и, если включен автодеплой, автоматически перезапускать проект с новыми изменениями.