Jeśli masz już w repozytorium GitHub aplikację Next.js lub Angular (Next.js w wersji 13 lub nowszej albo Angular w wersji 17.2 lub nowszej), rozpoczęcie korzystania z App Hosting może być tak proste, jak utworzenie backendu App Hostingu, a następnie rozpoczęcie wdrożenia z wypchnięciem do aktywnej gałęzi. Jeśli nie masz aplikacji, wykonaj czynności opisane w tym przewodniku, używając jednej z naszych przykładowych aplikacji.
Zanim zaczniesz
Zanim skonfigurujesz Firebase App Hosting, musisz utworzyć projekt Firebase (jeśli jeszcze go nie masz) i przejść na abonament Blaze.
Aby utworzyć projekt:
-
W konsoli Firebase kliknij Dodaj projekt.
-
Aby dodać zasoby Firebase do istniejącego projektu Google Cloud, wpisz jego nazwę lub wybierz go z menu.
-
Aby utworzyć nowy projekt, wpisz odpowiednią nazwę. Możesz też opcjonalnie edytować identyfikator projektu wyświetlany pod jego nazwą.
-
-
W razie potrzeby przeczytaj i zaakceptuj warunki korzystania z Firebase.
-
Kliknij Dalej.
-
(Opcjonalnie) Skonfiguruj Google Analytics w swoim projekcie, by zapewnić optymalną wygodę korzystania z tych usług Firebase:
Wybierz istniejące konto Google Analytics lub utwórz nowe.
Po utworzeniu nowego konta wybierz lokalizację raportowania Analytics, a następnie zaakceptuj w swoim projekcie ustawienia udostępniania danych i warunki korzystania z Google Analytics.
-
Kliknij Utwórz projekt (lub Dodaj Firebase, jeśli używasz istniejącego projektu Google Cloud).
Firebase automatycznie udostępnia zasoby projektu Firebase. Po zakończeniu tego procesu otworzy się strona przeglądu Twojego projektu Firebase w konsoli Firebase.
Krok 0 (opcjonalny). Utwórz repozytorium GitHub i aplikację internetową
Jeśli nie masz jeszcze aplikacji internetowej znajdującej się w repozytorium GitHub lub jeśli wolisz wypróbować ten proces z przykładową aplikacją, zacznij od zainicjowania jednego z naszych przykładów dla Next.js lub Angular:
npm init @apphosting
Przykładowa aplikację możesz uruchomić lokalnie za pomocą narzędzia next dev
lub ng start
. Aby kontynuować, utwórz nowe repozytorium GitHub i przekaż do niego nowo zainicjowany przykładowy kod.
Krok 1. Utwórz backend App Hosting
Backend App Hosting to zbiór zarządzanych zasobów tworzonych przez App Hosting w celu tworzenia i uruchamiania Twojej aplikacji internetowej. Backendy App Hosting możesz tworzyć i wyświetlać za pomocą konsoli Firebase lub interfejsu wiersza poleceń Firebase.
Konsola Firebase: w menu Build (Tworzenie) wybierz App Hosting (Hosting aplikacji), a następnie Get Started (Rozpocznij).
Interfejs wiersza poleceń: (wersja 3.9 lub nowsza). Aby utworzyć backend, uruchom to polecenie w katalogu głównym lokalnego katalogu projektu, podając identyfikator projektu jako argument (w przypadku podglądu obsługiwany jest tylko region us-central1
):
firebase apphosting:backends:create --project PROJECT_ID --location us-central1
W przypadku konsoli lub interfejsu wiersza poleceń postępuj zgodnie z instrukcjami, aby przypisać nazwę do backendu, skonfigurować połączenie z GitHub i skonfigurować te podstawowe ustawienia wdrożenia:
Ustaw katalog główny aplikacji (domyślnie
/
).Zwykle w tym miejscu znajduje się plik
package.json
.
Ustaw aktywną gałąź.
Jest to gałąź repozytorium GitHub, która jest wdrażana pod adresem URL wersji opublikowanej. Często jest to gałąź, z którą scalone są gałęzie cech lub gałęzie programowania.
Akceptowanie lub odrzucanie wdrożeń automatycznych
Wdrażanie automatyczne jest domyślnie włączone. Po utworzeniu backendu możesz wybrać, czy aplikacja ma zostać natychmiast wdrożona w App Hosting.
Krok 2. Wyświetl wdrożoną aplikację
Gdy tworzysz backend, Firebase udostępnia bezpłatną subdomenę, w której użytkownicy mogą odwiedzać Twoją aplikację internetową. Jej format to backend-id--project-id.us-central1.hosted.app
.
Aby wyświetlić adres URL aplikacji internetowej, sprawdź konsolę Firebase lub uruchom to polecenie w interfejsie wiersza poleceń:
firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID} --location us-central1
Krok 3. Aktywuj wdrożenie przez wypchnięcie zmiany
Gdy backend zostanie utworzony i masz już aktywny adres URL, możesz aktywować wdrażanie nowej wersji aplikacji internetowej za każdym razem, gdy wypchniesz zmiany do gałęzi aktywnej repozytorium GitHub. Aby przetestować konfigurację App Hostingu:
- W GitHubie prześlij zmianę do aktywnej gałęzi aplikacji internetowej.
- Otwórz kartę App Hosting (Hosting aplikacji) w konsoli Firebase i wybierz Wyświetl panel swojego backendu. Na liście tabel zobaczysz konkretne zatwierdzenie powiązane z wdrożeniem, które jest aktywowane przez Twoją zmianę.
Dalsze kroki
- Dowiedz się więcej: przejdź przez ćwiczenia z programowania Firebase, które integrują hostowaną aplikację z Uwierzytelnianiem Firebase i funkcjami AI od Google: Next.js | Angular
- Połącz domenę niestandardową
- Skonfiguruj backend
- Monitorowanie wdrożeń, wykorzystania witryny i logów.