/ DOCS
nav-img
Evolution

Развертывание frontend-приложения в контейнере

В этой лабораторной работе вы получите первый практический опыт использования облачных сервисов для запуска контейнерных приложений — Container Apps и Artifact Registry.

Схема развертывания приложения:

 ../_images/dev_experience.svg

  1. Разработчик загружает (push) Docker-образ приложения в Artifact Registry.

  2. Создает контейнер из загруженного образа в Container Apps.

  3. Приложение запускается в контейнере и доступно всем пользователям из интернета.

В ходе лабораторной работы повторите этот процесс на примере развертываения простого frontend-приложения.

Шаги:

  1. Подготовьте среду

  2. Клонируйте или скачайте репозиторий кода c GitVerse

  3. Соберите и подготовьте Docker-образ

  4. Загрузите Docker-образ в реестр

  5. Создайте и запустите контейнер

  6. Проверьте рабостоспособность развернутного приложения

1. Подготовьте среду

Подготовьте среду, если не сделали этого ранее.

2. Клонируйте или скачайте репозиторий кода c GitVerse

Опциональный шаг.

Вы можете зарегистрироваться в GitVerse, если у вас еще нет аккаунта, и познакомиться с новой системой контроля версий. Этот шаг необязательный и не влияет на дальнейшее прохождение лабораторной работы.

 ../_images/gitverse_clone.png

Клонируйте репозиторий:

  1. Перейдите в нужную директорию на локальном компьютере.

  2. Выполните команду в терминале GitBash:

     
    git clone https://gitverse.ru/cloudru/evo-containerapp-react-sample

3. Соберите и подготовьте Docker-образ

Cоберите на локальном компьютере готовый Docker-образ из репозитория GitVerse, выполнив в терминале следующую команду:

 
docker build --tag <registry_name>.cr.cloud.ru/react-hello-world https://gitverse.ru/cloudru/evo-containerapp-react-sample.git#master --platform linux/amd64

Команда собирает образ и тегирует его для дальнейшей загрузки в реестр. Для создания контейнера Docker-образ должен быть собран под платформу linux/amd64, поэтому в команде используется флаг platform со значением linux/amd64.

4. Загрузите Docker-образ в реестр Artifact Registry

  1. Загрузите образ в реестр Artifact Registry, выполнив команду:

     
    docker push <registry_name>.cr.cloud.ru/react-hello-world

    Где:

    • <registry_name> — название реестра, которое вы указывали при его создании в Artifact Registry;

    • react-hello-world — название будущего репозитория в Artifact Registry. Название репозитория соответствует имени Docker-образа.

  2. В личном кабинете перейдите в раздел с Реестры → Репозитории → Артефакты сервиса Artifact Registry и убедитесь, что образ загружен.

     ../_images/ar-repository-sucess.png

5. Создайте и запустите контейнер

  1. Откройте меню загруженного образа и нажмите Создать Container App.

     ../_images/ar-create-container.png

  2. Заполните поля и активируйте опции:

     ../_images/ar-container-params.png

    • Название контейнера — глобально уникальное имя, на базе которого формируется адрес вашего приложения в домене *.containers.cloud.ru.

    • Порт контейнера — порт контейнера, который должен совпадать с портом вашего приложения. В этой лабораторной работе используем порт 8080.

       
      server {
          listen 8080;
          root /usr/share/nginx/html;
          index index.html;
      

          location / {
              try_files $uri $uri/ /index.html;
          }
      }

    • vCPU/RAM — количество vCPU и RAM, которые выделяются для каждого экземпляра контейнера при обработке вызова. Выберите минимальную конфигурацию.

    • Минимальное и максимальное количество экземпляров при масштабировании сервиса. По умолчанию происходит масштабирование с 0, что может вызывать небольшую задержку при старте вашего приложения. Установите минимальное количество экземпляров — 0, а максимальное — 1.

    • Публичный адрес — активируйте опцию, чтобы получить URL-адрес для вызова приложения из интернета.

  3. Нажмите Создать. Откроется страница сервиса Container Apps.

Контейнер будет запущен в течение нескольких секунд. Дождитесь, когда контейнер и ревизия перейдут в статус «Выполняется».

 ../_images/ca-container-run.png

6. Проверьте рабостоспособность развернутного приложения

Дождитесь появления публичного URL, скопируйте его и вставьте в адресную строку браузера. Откроется страница приложения.

 ../_images/app-go.png

Что дальше

В этой лабораторной работе вы научились:

  • загружать Docker-образ в Artifact Registry;

  • создавать и запускать контейнер из быстрого меню в Artifact Registry.

Во второй лабораторной работе вы научитесь разворачивать backend-приложение и познакомитесь с дополнительными настройками облачных сервисов Container Apps и Artifact Registry.
Предыдущая статья
Подготовка среды
Следующая статья
Развертывание backend-приложения в контейнере
Была ли эта статья полезна?
Поддержка Юридические документы
© 2025 Cloud.ru