Начните работу с хостингом приложений

Имея существующее приложение Next.js или Angular (версии Next.js 13.5.x+ или Angular 18.2.x+) в репозитории GitHub, начать работу с App Hosting можно так же просто, как создать бэкенд App Hosting и начать его развертывание, отправив изменения в рабочую ветку. Если у вас нет приложения, воспользуйтесь одним из наших примеров, чтобы выполнить шаги, описанные в этом руководстве.

Прежде чем начать

Прежде чем вы сможете настроить Firebase App Hosting , вам необходимо создать проект Firebase (если у вас его еще нет) и перейти на план Blaze.

Чтобы создать проект:

Новичок в Firebase или облаке

Если вы новичок в Firebase или Google Cloud , выполните следующие действия.
Вы также можете выполнить эти шаги, если хотите создать совершенно новый проект Firebase (и его базовый проект Google Cloud ).

  1. Войдите в консоль Firebase .
  2. Нажмите кнопку, чтобы создать новый проект Firebase.

  3. В текстовом поле введите название проекта .

    Если вы являетесь частью организации Google Cloud , вы можете по желанию выбрать, в какой папке создать свой проект.

  4. При появлении соответствующего запроса ознакомьтесь с условиями Firebase и примите их, затем нажмите «Продолжить» .
  5. (Необязательно) Включите помощь ИИ в консоли Firebase (которая называется «Gemini в Firebase»), которая поможет вам приступить к работе и оптимизировать процесс разработки.

  6. (Необязательно) Настройте Google Analytics для своего проекта, что обеспечит оптимальную работу с использованием следующих продуктов Firebase: Firebase A/B Testing , Cloud Messaging , Crashlytics , In-App Messaging и Remote Config (включая Personalization ).

    Выберите существующий аккаунт Google Analytics или создайте новый. При создании нового аккаунта выберите местоположение для отчётов Google Analytics , а затем примите настройки доступа к данным и условия использования Google Analytics для вашего проекта.

  7. Нажмите Создать проект .

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

Существующий облачный проект

Выполните следующие шаги, чтобы начать использовать Firebase в существующем проекте Google Cloud . Подробнее о добавлении Firebase в существующий проект Google Cloud читайте здесь.

  1. Войдите в консоль Firebase , используя учетную запись, которая предоставляет вам доступ к существующему проекту Google Cloud .
  2. Нажмите кнопку, чтобы создать новый проект Firebase.
  3. В нижней части страницы нажмите Добавить Firebase в проект Google Cloud .
  4. В текстовом поле начните вводить название существующего проекта, а затем выберите проект из отображаемого списка.
  5. Нажмите Открыть проект .
  6. При появлении соответствующего запроса ознакомьтесь с условиями Firebase и примите их, затем нажмите «Продолжить» .
  7. (Необязательно) Включите помощь ИИ в консоли Firebase (которая называется «Gemini в Firebase»), которая поможет вам приступить к работе и оптимизировать процесс разработки.

  8. (Необязательно) Настройте Google Analytics для своего проекта, что обеспечит оптимальную работу с использованием следующих продуктов Firebase: Firebase A/B Testing , Cloud Messaging , Crashlytics , In-App Messaging и Remote Config (включая Personalization ).

    Выберите существующий аккаунт Google Analytics или создайте новый. При создании нового аккаунта выберите местоположение для отчётов Google Analytics , а затем примите настройки доступа к данным и условия использования Google Analytics для вашего проекта.

  9. Нажмите Добавить Firebase .

Firebase добавляет Firebase в ваш существующий проект . После завершения процесса вы будете перенаправлены на страницу обзора вашего проекта Firebase в консоли Firebase .

Шаг 0 (необязательно): создайте репозиторий GitHub и веб-приложение.

Если у вас еще нет веб-приложения, размещенного в репозитории GitHub, или вы предпочитаете попробовать поток с примером приложения, начните с инициализации одного из наших примеров для Next.js или Angular:

npm init @apphosting

Вы можете запустить пример приложения локально, используя next dev или ng start . Чтобы продолжить, создайте новый репозиторий GitHub и отправьте в него только что инициализированный пример кода.

Шаг 1: Создайте серверную часть App Hosting

Бэкэнд App Hosting представляет собой набор управляемых ресурсов, которые App Hosting создает для создания и запуска вашего веб-приложения.

Консоль Firebase : в меню «Сборка» выберите «Хостинг приложений» , а затем «Начать» .

CLI: (Версия 13.15.4 или более поздняя) Чтобы создать бэкэнд, выполните следующую команду из корня локального каталога проекта, указав свой projectID в качестве аргумента:

firebase apphosting:backends:create --project PROJECT_ID

Для консоли или CLI следуйте инструкциям по выбору региона , настройке подключения к GitHub и настройке следующих основных параметров развертывания:

  • Установите корневой каталог вашего приложения (по умолчанию / )

    Обычно именно здесь находится файл package.json .

  • Установить живую ветку

    Это ветка вашего репозитория GitHub, которая развёртывается по вашему текущему URL-адресу. Часто именно в эту ветку объединяются ветки функций или ветки разработки.

  • Принять или отклонить автоматическое развертывание

    Автоматическое развертывание включено по умолчанию. После завершения создания бэкенда вы можете выбрать немедленное развертывание приложения на App Hosting .

  • Присвойте имя вашему бэкэнду.

Шаг 2: Просмотр развернутого приложения

При создании бэкенда Firebase предоставляет вам бесплатный поддомен, где конечные пользователи смогут посещать ваше веб-приложение. Формат поддомена: backend-id -- project-id .us-central1.hosted.app .

Чтобы просмотреть URL-адрес вашего веб-приложения, проверьте консоль Firebase или выполните следующую команду CLI:

firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID}

Шаг 3: Запустите развертывание, отправив изменение

После создания бэкенда и получения активного URL-адреса вы можете запускать выпуск новой версии веб-приложения при каждом добавлении изменений в активную ветку репозитория GitHub. Чтобы протестировать настройку App Hosting :

  1. В GitHub отправьте изменение в действующую ветку веб-приложения.
  2. Откройте вкладку App Hosting в консоли Firebase и выберите «Просмотреть панель мониторинга» для вашего бэкенда. В таблице отображается конкретный коммит, связанный с развертыванием, инициированным вашим изменением.

Следующие шаги