Dengan aplikasi Next.js atau Angular yang sudah ada (Next.js versi 13+ atau Angular 17.2+) di repositori GitHub, memulai dengan App Hosting dapat sebagai sangat mudah, seperti membuat backend App Hosting, lalu memulai luncurkan dengan push ke cabang live Anda. Jika Anda belum memiliki aplikasi, gunakan salah satu aplikasi contoh kami untuk memandu langkah-langkah yang dijelaskan dalam panduan ini.
Sebelum memulai
Agar dapat menyiapkan Firebase App Hosting, Anda harus membuat Firebase (jika Anda belum memilikinya) dan tingkatkan ke paket Blaze.
Untuk membuat project:
-
Di konsol Firebase, klik Tambahkan project.
-
Untuk menambahkan resource Firebase ke project Google Cloud yang sudah ada, masukkan nama proyek Anda atau pilih dari menu {i>dropdown<i}.
-
Untuk membuat project baru, masukkan nama project yang diinginkan. Anda juga dapat mengedit project ID yang ditampilkan di bawah nama project.
-
-
Jika diminta, tinjau dan setujui persyaratan Firebase.
-
Klik Lanjutkan.
-
(Opsional) Siapkan Google Analytics untuk project Anda agar Anda dapat untuk mendapatkan pengalaman optimal menggunakan salah satu produk Firebase berikut:
Pilih salah satu yang ada Akun Google Analytics atau untuk membuat akun baru.
Jika Anda membuat akun baru, pilih Analytics melaporkan lokasi, lalu setujui setelan berbagi data dan persyaratan Google Analytics untuk project Anda.
-
Klik Create project (atau Add Firebase, jika Anda menggunakan project Google Cloud yang ada).
Firebase otomatis menyediakan resource untuk project Firebase Anda. Kapan prosesnya selesai, Anda akan dibawa ke halaman ringkasan untuk Firebase di konsol Firebase.
Langkah 0 (opsional): Buat repositori GitHub dan aplikasi Web
Jika Anda belum memiliki aplikasi Web yang berada di repositori GitHub, atau jika Anda ingin lebih baik mencoba alurnya dengan aplikasi contoh, mulailah dengan menginisialisasi salah satu sampel kami, untuk Next.js atau Angular:
npm init @apphosting
Anda dapat menjalankan aplikasi contoh secara lokal menggunakan next dev
atau ng start
. Untuk melanjutkan,
membuat repositori GitHub baru
dan mengirim kode contoh yang baru diinisialisasi.
Langkah 1: Buat backend App Hosting
Backend App Hosting adalah kumpulan resource terkelola yang App Hosting buat untuk membangun dan menjalankan aplikasi Web Anda. Anda dapat membuat dan mencantumkan App Hosting backend menggunakan konsol Firebase atau CLI Firebase.
Firebase console: Dari menu Build, pilih App Hosting, lalu Mulai.
CLI: (Versi 3.9 atau yang lebih baru) Untuk membuat backend, jalankan perintah berikut
dari root direktori proyek lokal Anda, yang menyediakan
project ID sebagai argumen (untuk pratinjau,
hanya region us-central1
yang didukung):
firebase apphosting:backends:create --project PROJECT_ID --location us-central1
Untuk konsol atau CLI, ikuti petunjuk untuk menetapkan nama ke backend Anda, untuk tolong atur Koneksi GitHub, dan mengonfigurasi setelan deployment dasar ini:
Menyetel direktori utama aplikasi Anda (default-nya adalah
/
)Biasanya di sinilah file
package.json
Anda berada.
Menetapkan live cabang
Ini adalah cabang dari repositori GitHub Anda yang akan di-deploy ke URL aktif. Sering kali, ini adalah cabang tempat cabang atau pengembangan fitur cabang-cabang digabungkan.
Menyetujui atau menolak peluncuran otomatis
Peluncuran otomatis diaktifkan secara default. Setelah selesai membuat backend, Anda dapat memilih agar aplikasi Anda segera di-deploy ke App Hosting.
Langkah 2: Lihat aplikasi yang di-deploy
Saat Anda membuat backend, Firebase akan memberi Anda subdomain tanpa biaya di mana
pengguna dapat mengunjungi
aplikasi Web Anda. Formatnya
adalah backend-id--project-id.us-central1.hosted.app
.
Untuk melihat URL aplikasi Web, periksa Firebase console, atau jalankan CLI berikut berikut:
firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID} --location us-central1
Langkah 3: Picu peluncuran dengan mengirim perubahan
Setelah backend dibuat dan Anda memiliki URL aktif, Anda dapat memicu peluncuran versi baru aplikasi Web setiap kali Anda melakukan push ke cabang aktif dari repositori GitHub Anda. Untuk melakukan pengujian konfigurasi App Hosting Anda:
- Di GitHub, kirim perubahan ke cabang aktif aplikasi Web.
- Buka App Hosting tab di konsol Firebase dan pilih Lihat dasbor untuk backend Anda. Daftar tabel menampilkan commit tertentu yang terkait dengan peluncuran dipicu oleh perubahan Anda.
Langkah berikutnya
- Lebih dalam: pelajari codelab Firebase yang mengintegrasikan aplikasi yang dihosting dengan fitur Firebase Authentication dan Google AI: Next.js | Angular
- Menghubungkan domain kustom.
- Konfigurasi backend Anda.
- Pantau peluncuran, penggunaan situs, dan log.