Firebase'i JavaScript projenize ekleyin

Firebase JavaScript SDK'sını web uygulamanızda veya son kullanıcı erişimi için istemci olarak (ör. Node.js masaüstü veya IoT uygulamasında) kullanmak için bu kılavuzu inceleyin.

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

Firebase'i JavaScript uygulamanıza ekleyebilmek için 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 eklemeyle ilgili en iyi uygulamalar hakkında daha fazla bilgi edinmek için Firebase Projelerini Anlama başlıklı makaleyi inceleyin.

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

2. adım: SDK'yı yükleyin ve Firebase'i ilk kullanıma hazırlayın

Bu sayfada, JavaScript modülü biçimini kullanan Firebase JavaScript SDK'sı için modüler API'nin kurulum talimatları açıklanmaktadır.

Bu iş akışı, npm kullanır ve modül paketleyiciler veya JavaScript çerçevesi araçları gerektirir. Bunun nedeni, modüler API'nin kullanılmayan kodu ortadan kaldırmak (tree-shaking) ve SDK boyutunu küçültmek için modül paketleyicilerle çalışacak şekilde optimize edilmiş olmasıdır.

  1. npm kullanarak Firebase'i yükleyin:

    npm install firebase

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

    import { initializeApp } from 'firebase/app';

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

const app = initializeApp(firebaseConfig);

    Firebase uygulaması, ortak yapılandırmayı depolayan ve Firebase hizmetleri arasında kimlik doğrulamayı paylaşan, kapsayıcı benzeri bir nesnedir. Kodunuzda bir Firebase App nesnesini başlattıktan sonra Firebase hizmetlerini ekleyip kullanmaya başlayabilirsiniz.

    Uygulamanızda sunucu tarafı oluşturmaya (SSR) dayalı dinamik özellikler varsa yapılandırmanızın sunucu oluşturma ve istemci oluşturma geçişlerinde kalıcı olmasını sağlamak için bazı ek adımlar uygulamanız gerekir. Sunucu mantığınızda, uygulamanızın hizmet çalışanlarıyla oturum yönetimini optimize etmek için FirebaseServerApp arayüzünü uygulayın.

3. adım: Uygulamanızda Firebase'e erişme

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

Aşağıdaki örnekte, veri listesi almak için Cloud Firestore Lite SDK'yı nasıl kullanabileceğiniz gösterilmektedir.

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

// TODO: Replace the following with your app&#39;s Firebase 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;
}

4. adım: Boyutu küçültmek için bir modül paketleyici (webpack/Rollup) kullanın.

Firebase JavaScript SDK'sı, kullanılmayan kodları kaldırmak (tree-shaking) için modül paketleyicilerle çalışacak şekilde tasarlanmıştır. Üretim uygulamaları için bu yaklaşımı kullanmanızı önemle tavsiye ederiz. 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 gerçekleştirir.

Daha fazla bilgi için Firebase ile modül paketleyicileri kullanma kılavuzumuzu inceleyin.

Web için kullanılabilen Firebase hizmetleri

Firebase'i kullanmak için gerekli ayarları yaptığınıza göre, aşağıdaki Firebase hizmetlerinden dilediğinizi web uygulamanıza ekleyip kullanmaya başlayabilirsiniz.

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

1 Firebase AI Logic, daha önce firebase/vertexai paketiyle "Vertex AI in Firebase" olarak adlandırılıyordu.

2 Firebase SQL Connect, daha önce "Firebase Data Connect" olarak adlandırılıyordu.

Sonraki adımlar

Firebase hakkında bilgi: