Uygulama Barındırma'yı kullanmaya başlayın

GitHub deposunda mevcut bir Next.js veya Angular uygulaması (Next.js 13.5.x+ ya da Angular 18.2.x+) varsa App Hosting ile çalışmaya başlamak, App Hosting arka ucu oluşturup canlı dalınıza gönderme işlemiyle dağıtımı başlatmak kadar kolaydır. Uygulamanız yoksa bu kılavuzda açıklanan adımları incelemek için örnek uygulamalarımızdan birini kullanın.

Bu rehberde, GitHub deposunda her yeni kaydetme işlemi yapıldığında otomatik olarak dağıtmak için Firebase konsolunda App Hosting nasıl ayarlanacağı açıklanmaktadır. Bu akışın sonunda, GitHub deponuzun main dalında her yeni değişiklik kaydettiğinizde yeniden dağıtılan canlı bir Next.js veya Angular örnek uygulamanız olur.

Bu kılavuzda önerilen Firebase konsol akışına odaklanılsa da GitHub bağlantısı olmadan yerel kodu dağıtmak için Firebase KSA'yı kullanmak da dahil olmak üzere başka dağıtım yöntemleri vardır.

1. adım: Demo deposunu çatallayın

https://github.com/firebase/apphosting-adapters adresine gidin ve Fork'u (Çatal) seçin.

2. adım: App Hosting arka ucu oluşturun

  1. Firebase konsolunda Hosting ve Sunucusuz > App Hosting'ya gidin.

  2. Başlayın'ı tıklayın.

  3. İstenirse App Hosting kullanmak için kullandıkça öde Blaze fiyatlandırma planına yükseltin.

App Hosting arka uç kurulumunun ekran görüntüsü.

Bu adımları tamamlamak için istemleri uygulayın:

  • Birincil bölge seçin (genellikle kullanıcılarınıza en yakın bölge).
  • GitHub'a bağlanın. firebase-framework-tools deposunu çatallayarak yeni oluşturduğunuz depoyu seçin.
  • Uygulamanızın kök dizinini aşağıdakilerden birine ayarlayın:
  • Canlı dalı main olarak ayarlayın.
  • Otomatik kullanıma sunma işlemlerini etkinleştirin (otomatik kullanıma sunma işlemleri varsayılan olarak etkindir).
  • Arka uçunuza bir ad atayın.
  • Çalışma zamanı ortamınızı seçin. Varsayılan olarak, en yeni önerilen Node.js sürümü sizin için önceden seçilir.
    • Otomatik temel görüntü güncellemelerini (ABIU) yapılandırın. ABIU varsayılan olarak etkindir ve temel ortamınıza güvenlik yamalarını otomatik olarak uygular. Çalışma zamanınız için "Belirtilmedi"yi seçerek ABIU'yu devre dışı bırakabilirsiniz.
  • Yeni bir Firebase web uygulaması oluşturun.

Bitir ve dağıt'ı seçin.

3. adım: Dağıtılan uygulamayı görüntüleyin

Bir arka uç oluşturduğunuzda Firebase, son kullanıcıların web uygulamanızı ziyaret edebileceği ücretsiz bir alt alan adı sağlar. Bu alan adının biçimi backend-id--project-id.us-central1.hosted.app şeklindedir.

Arka uç kontrol panelindeki Arka uç bilgileri satırında, yeni web sitenizi görüntülemek için canlı arka ucunuzun bağlantısını seçin:

Canlı uygulama bağlantısının vurgulandığı arka uç bilgileri satırının ekran görüntüsü.

4. adım: Değişiklik göndererek kullanıma sunma işlemini tetikleyin

Arka uçunuz oluşturulduktan ve canlı bir URL'niz olduktan sonra, GitHub deponuzun canlı dalına değişiklikleri her aktardığınızda web uygulamanızın yeni bir sürümünün kullanıma sunulmasını tetikleyebilirsiniz. App Hosting kurulumunuzun testini yapmak için:

  1. Demo GitHub deposunun kendi çatalınızda, demo uygulamasının ana sayfasının kaynağına gidin, istediğiniz tanınabilir düzenlemeyi yapın ve ardından değişikliğinizi ana dala gönderin. Ana sayfanızı bulmak için:

    • Next.js: /starters/nextjs/basic/src/app/page.tsx
    • Angular: /starters/angular/basic/src/app/pages/home/home.component.html

  2. Firebase konsolunda, yeni değişikliğiniz üretime sunulurken App Hosting izleyin. Lansman tamamlandığında, değişikliğinizi uygulamanın ana sayfasında görüntüleyebilirsiniz.

Sonraki adımlar