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.
Başlamadan önce
Firebase App Hosting'ı ayarlayabilmek için Firebase projesi oluşturmanız (henüz oluşturmadıysanız) ve Blaze planına yükseltmeniz gerekir.
Proje oluşturmak için:
-
Firebase konsolunda Proje ekle'yi tıklayın.
-
Firebase kaynaklarını mevcut bir Google Cloud projeye eklemek için projenin adını girin veya açılır menüden projeyi seçin.
-
Yeni bir proje oluşturmak için proje adı girin. İsterseniz proje adının altında gösterilen proje kimliğini de düzenleyebilirsiniz.
-
-
İstenirse Firebase şartlarını inceleyip kabul edin.
-
Devam'ı tıklayın.
-
(İsteğe bağlı) Projeniz için Google Analytics'ı ayarlayın. Bu, aşağıdaki Firebase ürünlerini kullanarak optimum bir deneyim sağlar: Firebase A/B Testing, Cloud Messaging, Crashlytics, In-App Messaging ve Remote Config (kişiselleştirme dahil).
Mevcut bir Google Analytics hesabı seçin veya yeni bir hesap oluşturun. Yeni bir hesap oluşturursanız Analytics raporlama konumunuzu seçin, ardından projeniz için veri paylaşım ayarlarını ve Google Analytics şartlarını kabul edin.
-
Proje oluştur'u (veya Firebase'i mevcut bir Google Cloud projesine ekliyorsanız Firebase ekle'yi) tıklayın.
Firebase, Firebase projeniz için kaynakları otomatik olarak sağlar. İşlem tamamlandığında Firebase konsolunda Firebase projenizin genel bakış sayfasına yönlendirilirsiniz.
0. adım (isteğe bağlı): GitHub deposu ve web uygulaması oluşturun
GitHub deposunda bulunan bir web uygulamanız yoksa veya akışı örnek bir uygulamayla denemek istiyorsanız Next.js ya da Angular için örneklerimizden birini başlatarak başlayın:
npm init @apphosting
Örnek uygulamayı next dev
veya ng start
kullanarak yerel olarak çalıştırabilirsiniz. Devam etmek için yeni bir GitHub deposu oluşturun ve yeni başlatılan örnek kodu bu depoya aktarın.
1. adım: App Hosting arka ucu oluşturun
App HostingArka uçApp Hosting, web uygulamanızı oluşturmak ve çalıştırmak için App Hosting tarafından oluşturulan yönetilen kaynaklar topluluğudur.
Firebase konsolu: Derleme menüsünden Uygulama Hosting'i ve ardından Başlayın'ı seçin.
KSA: (13.15.4 veya sonraki sürümler) Arka uç oluşturmak için yerel proje dizininizin kökünden aşağıdaki komutu çalıştırın ve projectID değerini bağımsız değişken olarak girin:
firebase apphosting:backends:create --project PROJECT_ID
Hem konsol hem de CLI için istemleri uygulayarak bir bölge seçin, GitHub bağlantısı oluşturun ve aşağıdaki temel dağıtım ayarlarını yapılandırın:
Uygulamanızın kök dizinini ayarlayın (varsayılan olarak
/
ayarlanır).Bu genellikle
package.json
dosyanızın bulunduğu yerdir.
Canlı dalı ayarlama
Bu, GitHub deponuzun canlı URL'nize dağıtılan dalıdır. Genellikle özellik dallarının veya geliştirme dallarının birleştirildiği daldır.
Otomatik kullanıma sunma işlemlerini kabul etme veya reddetme
Otomatik kullanıma sunma özelliği varsayılan olarak etkindir. Arka uç oluşturma işlemi tamamlandıktan sonra uygulamanızın hemen App Hosting'ya dağıtılmasını seçebilirsiniz.
Arka uçunuza bir ad atayın.
2. 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.
Web uygulamanızın URL'sini görüntülemek için Firebase konsolunu kontrol edin veya aşağıdaki KSA komutunu çalıştırın:
firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID}
3. adım: Değişiklik göndererek dağıtımı 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:
- GitHub'da web uygulamasının canlı dalına bir değişiklik gönderin.
- Firebase konsolunda App Hosting sekmesini açıp arka uçunuz için Kontrol panelini görüntüle'yi seçin. Tablo listesinde, değişikliğinizin tetiklediği dağıtımla ilişkili belirli onaylama gösterilir.
Sonraki adımlar
- Daha ayrıntılı bilgi: Barındırılan bir uygulamayı Firebase Authentication ve Google Yapay Zeka özellikleri ile entegre eden bir Firebase codelab'ini inceleyin: Next.js | Angular
- Özel alan bağlayın.
- Arka uçunuzu yapılandırma: Ortam değişkenlerini ayarlama, gizli parametreleri depolama ve daha fazlası.
- Yayınları, site kullanımını ve günlükleri izleyin.