JavaScript projenize Firebase ekleyin

Firebase JavaScript SDK'sını web uygulamanızda veya son kullanıcı erişimi için istemci olarak (örneğin, Node.js masaüstünde veya IoT uygulamasında) 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 kaydettiğinizde, uygulamanızı Firebase proje kaynaklarınıza 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ünü denemek istiyorsanız hızlı başlangıç ​​örneklerimizden birini indirebilirsiniz.

Adım 2 : SDK'yı yükleyin ve Firebase'i başlatın

Bu sayfada, Firebase JS SDK'nın JavaScript Modül biçimini kullanan modüler API'sine yönelik kurulum talimatları açıklanmaktadır.

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

  1. Firebase'i npm kullanarak yükleyin:

    npm install firebase

  2. Uygulamanızda Firebase'i başlatın ve bir Firebase Uygulama 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ı, Firebase hizmetleri genelinde ortak yapılandırmayı depolayan ve kimlik doğrulamasını paylaşan konteyner benzeri bir nesnedir. Kodunuzda bir Firebase Uygulama nesnesi başlattıktan sonra Firebase hizmetlerini ekleyip 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 halinde 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/Toplama) kullanın

Firebase Web SDK'sı, kullanılmayan kodları kaldırmak (ağaç sallama) için modül paketleyicilerle çalışacak şekilde tasarlanmıştır. Bu yaklaşımı üretim uygulamaları için kullanmanızı önemle ö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 paketlemeyi otomatik olarak yönetir.

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

Web için mevcut Firebase hizmetleri

Artık Firebase'i kullanacak şekilde kurulum yaptığınıza göre, web uygulamanıza aşağıdaki mevcut Firebase hizmetlerinden herhangi birini eklemeye ve kullanmaya başlayabilirsiniz.

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

Sonraki adımlar

Firebase hakkında bilgi edinin: