Mulai menggunakan Hosting Aplikasi

Dengan aplikasi Next.js atau Angular yang ada (Next.js versi 13+ atau Angular 17.2+) di repositori GitHub, memulai App Hosting dapat dilakukan dengan mudah seperti membuat backend App Hosting, lalu memulai peluncuran dengan push ke cabang aktif Anda. Jika Anda tidak memiliki aplikasi, gunakan salah satu aplikasi contoh kami untuk mempelajari langkah-langkah yang dijelaskan dalam panduan ini.

Sebelum memulai

Sebelum dapat menyiapkan Firebase App Hosting, Anda harus membuat project Firebase (jika belum memilikinya) dan mengupgrade ke paket Blaze.

Untuk membuat project:

  1. Di Firebase console, klik Add project.

    • Untuk menambahkan resource Firebase ke project Google Cloud yang sudah ada, masukkan nama project-nya atau pilih dari menu dropdown.

    • Untuk membuat project baru, masukkan nama project yang diinginkan. Anda juga dapat mengedit project ID yang ditampilkan di bawah nama project.

  2. Jika diminta, tinjau dan setujui persyaratan Firebase.

  3. Klik Continue.

  4. (Opsional) Siapkan Google Analytics untuk project Anda dan optimalkan penggunaan produk-produk Firebase berikut:

    Pilih akun Google Analytics yang ada atau buat akun baru.

    Jika Anda membuat akun baru, pilih lokasi pelaporan Analytics, lalu setujui setelan berbagi data dan persyaratan Google Analytics untuk project Anda.

  5. Klik Create project (atau Add Firebase, jika Anda menggunakan project Google Cloud yang sudah ada).

Firebase menyediakan resource untuk project Firebase Anda secara otomatis. Begitu selesai, Anda akan dibawa ke halaman ringkasan untuk project Firebase Anda di Firebase console.

Langkah 0 (opsional): Membuat repositori GitHub dan aplikasi Web

Jika Anda belum memiliki aplikasi Web yang berada di repositori GitHub, atau jika Anda lebih memilih untuk mencoba alur dengan aplikasi contoh, mulailah dengan menginisialisasi salah satu contoh kami, baik untuk Next.js maupun Angular:

npm init @apphosting

Anda dapat menjalankan aplikasi contoh secara lokal menggunakan next dev atau ng start. Untuk melanjutkan, buat repositori GitHub baru dan kirim kode contoh yang baru diinisialisasi ke repositori tersebut.

Langkah 1: Buat backend App Hosting

Backend App Hosting adalah kumpulan resource terkelola yang dibuat oleh App Hosting untuk mem-build dan menjalankan aplikasi Web Anda. Setiap Pemilik project dapat membuat backend App Hosting pertama untuk project menggunakan Firebase console atau Firebase CLI. Setelah penyiapan awal ini, Admin App Hosting juga dapat membuat dan mengelola backend tambahan. Untuk mengetahui detailnya, lihat Peran IAM Firebase App Hosting.

Firebase console: Dari menu Build, pilih App Hosting, lalu Get started.

CLI: (Versi 13.15.4 atau yang lebih baru) Untuk membuat backend, jalankan perintah berikut dari root direktori project lokal Anda, dengan memberikan projectID dan region pilihan sebagai argumen:

firebase apphosting:backends:create --project PROJECT_ID --location us-central1

Untuk konsol atau CLI, ikuti petunjuk untuk menetapkan nama ke backend Anda, untuk menyiapkan koneksi GitHub, dan mengonfigurasi setelan deployment dasar ini:

  • Menetapkan direktori utama aplikasi (defaultnya /)

    Biasanya, file package.json Anda berada di sini.

  • Menetapkan cabang aktif

    Ini adalah cabang repositori GitHub Anda yang di-deploy ke URL aktif Anda. Sering kali, cabang ini adalah cabang tempat cabang fitur atau cabang pengembangan digabungkan.

  • Menerima atau menolak peluncuran otomatis

    Peluncuran otomatis diaktifkan secara default. Setelah pembuatan backend selesai, Anda dapat memilih agar aplikasi segera di-deploy ke App Hosting.

Langkah 2: Lihat aplikasi yang di-deploy

Saat Anda membuat backend, Firebase akan memberi Anda subdomain tanpa biaya tempat pengguna akhir 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 perintah CLI berikut:

firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID} --location us-central1

Langkah 3: Memicu peluncuran dengan menerapkan perubahan

Setelah backend dibuat dan Anda memiliki URL aktif, Anda dapat memicu peluncuran versi baru aplikasi Web setiap kali Anda mendorong perubahan ke cabang aktif repositori GitHub. Untuk melakukan pengujian penyiapan App Hosting:

  1. Di GitHub, kirim perubahan ke cabang aktif aplikasi Web.
  2. Buka tab App Hosting di Firebase console, lalu pilih Lihat dasbor untuk backend Anda. Daftar tabel menampilkan commit tertentu yang terkait dengan peluncuran yang dipicu oleh perubahan Anda.

Langkah berikutnya