JavaScript projenize Firebase ekleyin

Koleksiyonlar ile düzeninizi koruyun İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.

Firebase JavaScript SDK'yı web uygulamanızda veya örneğin bir Node.js masaüstünde veya IoT uygulamasında son kullanıcı erişimi için bir istemci olarak kullanmak için bu kılavuzu izleyin.

1. Adım : Bir Firebase projesi oluşturun ve uygulamanızı kaydedin

Firebase'i JavaScript uygulamanıza ekleyebilmeniz için önce bir Firebase projesi oluşturmanız ve uygulamanızı bu projeye kaydetmeniz gerekir. Uygulamanızı Firebase'e kaydettirdiğinizde, uygulamanızı Firebase proje kaynaklarınızla bağlamak için kullanacağınız bir Firebase yapılandırma nesnesi alırsınız.

Firebase projeleri ve projelere uygulama eklemeye yönelik en iyi uygulamalar hakkında daha fazla bilgi edinmek için Firebase Projelerini Anlayın sayfasını ziyaret edin.

Henüz bir JavaScript projeniz yoksa ve yalnızca bir Firebase ürünü denemek istiyorsanız, hızlı başlangıç ​​örneklerimizden birini indirebilirsiniz.

2. Adım : SDK'yı kurun ve Firebase'i başlatın

Bu sayfada, JavaScript Modülü formatı kullanan Firebase JS SDK'nın 9. sürümü için kurulum talimatları açıklanmaktadır.

Bu iş akışı npm kullanır ve modül paketleyicileri veya JavaScript çerçeve araçlarını gerektirir çünkü v9 SDK, kullanılmayan kodu (ağaç sallama) ortadan kaldırmak ve SDK boyutunu azaltmak için modül paketleyicilerle çalışacak şekilde optimize edilmiştir.

  1. Firebase'i npm kullanarak kurun:

    npm install firebase

  2. Uygulamanızda Firebase'i başlatın ve bir Firebase Uygulaması nesnesi oluşturun:

    import { initializeApp } from 'firebase/app';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);

    Firebase Uygulaması, ortak yapılandırmayı depolayan ve Firebase hizmetlerinde kimlik doğrulamasını paylaşan kapsayıcı benzeri bir nesnedir. Kodunuzda bir Firebase Uygulaması nesnesi başlattıktan sonra, Firebase hizmetlerini ekleyebilir ve kullanmaya başlayabilirsiniz.

3. Adım : Uygulamanızda Firebase'e erişin

Firebase hizmetleri (Cloud Firestore, Authentication, Realtime Database, Remote Config ve daha fazlası gibi) ayrı alt paketler içinde içe aktarılabilir.

Aşağıdaki örnek, bir veri listesini almak için Cloud Firestore Lite SDK'yı nasıl kullanabileceğinizi gösterir.

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore/lite';
// Follow this pattern to import other Firebase services
// import { } from 'firebase/<service>';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

// Get a list of cities from your database
async function getCities(db) {
  const citiesCol = collection(db, 'cities');
  const citySnapshot = await getDocs(citiesCol);
  const cityList = citySnapshot.docs.map(doc => doc.data());
  return cityList;
}

Adım 4 : Boyut küçültme için bir modül paketleyici (webpack/Rollup) kullanın

Firebase Web SDK'sı, kullanılmayan kodları (ağaç sallama) kaldırmak için modül paketleyicilerle çalışacak şekilde tasarlanmıştır. Üretim uygulamaları için bu yaklaşımı kullanmanızı kesinlikle öneririz. Angular CLI , Next.js , Vue CLI veya Create React App gibi araçlar, npm aracılığıyla yüklenen ve kod tabanınıza aktarılan kitaplıklar için modül gruplamayı otomatik olarak işler.

Daha fazla bilgi için Firebase ile modül paketleyicileri kullanma kılavuzumuza bakın.

Web için kullanılabilir Firebase hizmetleri

Artık Firebase'i kullanmaya hazır olduğunuza göre, web uygulamanıza aşağıdaki mevcut Firebase hizmetlerinden herhangi birini ekleyip kullanmaya başlayabilirsiniz.

Aşağıdaki komutlar, npm ile yerel olarak npm kitaplıklarının nasıl içe aktarılacağını gösterir. Alternatif içe aktarma seçenekleri için mevcut kitaplık belgelerine bakın.

Sonraki adımlar

Firebase hakkında bilgi edinin: