Check out what’s new from Firebase at Google I/O 2022. Learn more

JavaScript projenize Firebase ekleyin

Firebase JavaScript SDK'sını 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

JavaScript uygulamanıza Firebase eklemeden ö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ı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ünü denemek istiyorsanız, hızlı başlangıç ​​örneklerimizden birini indirebilirsiniz.

Adım 2 : 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ı gerektirir çünkü v9 SDK, kullanılmayan kodu (ağaç sallama) ortadan kaldırmak ve SDK boyutunu azaltmak için modül paketleyicilerle çalışmak üzere 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 App 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üçültmek için bir modül paketleyici (web paketi/Toplama) kullanın

Firebase Web SDK, kullanılmayan kodları (ağaç sallama) kaldırmak için modül paketleyicilerle birlikte çalışacak şekilde tasarlanmıştır. Üretim uygulamaları için bu yaklaşımı kullanmanızı şiddetle ö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 işler.

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 kullanmak üzere ayarladığı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 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: