Postępuj zgodnie z tym przewodnikiem, aby używać pakietu SDK Firebase JavaScript w swojej aplikacji internetowej lub jako klienta umożliwiającego dostęp użytkownikowi końcowemu, na przykład w aplikacji komputerowej Node.js lub aplikacji IoT.
Krok 1 : Utwórz projekt Firebase i zarejestruj swoją aplikację
Zanim będziesz mógł dodać Firebase do swojej aplikacji JavaScript, musisz utworzyć projekt Firebase i zarejestrować w nim swoją aplikację. Po zarejestrowaniu aplikacji w Firebase otrzymasz obiekt konfiguracyjny Firebase, którego będziesz używać do łączenia aplikacji z zasobami projektu Firebase.
Odwiedź stronę Poznaj projekty Firebase , aby dowiedzieć się więcej o projektach Firebase i najlepszych praktykach dotyczących dodawania aplikacji do projektów.
Jeśli nie masz jeszcze projektu JavaScript i chcesz po prostu wypróbować produkt Firebase, możesz pobrać jeden z naszych przykładów szybkiego startu .
Krok 2 : Zainstaluj pakiet SDK i zainicjuj Firebase
Na tej stronie opisano instrukcje konfiguracji modułowego interfejsu API pakietu Firebase JS SDK, który korzysta z formatu modułu JavaScript .
Ten przepływ pracy korzysta z npm i wymaga pakietów modułów lub narzędzi platformy JavaScript, ponieważ modułowy interfejs API jest zoptymalizowany do współpracy z pakietami modułów w celu wyeliminowania nieużywanego kodu (wstrząsania drzewem) i zmniejszenia rozmiaru zestawu SDK.
Zainstaluj Firebase za pomocą npm:
npm install firebase
Zainicjuj Firebase w swojej aplikacji i utwórz obiekt Firebase App:
import { initializeApp } from 'firebase/app'; // TODO: Replace the following with your app's Firebase project configuration const firebaseConfig = { //... }; const app = initializeApp(firebaseConfig);
Aplikacja Firebase to obiekt przypominający kontener, który przechowuje wspólną konfigurację i udostępnia uwierzytelnianie w usługach Firebase. Po zainicjowaniu obiektu aplikacji Firebase w kodzie możesz dodać usługi Firebase i zacząć z nich korzystać.
Krok 3 : Uzyskaj dostęp do Firebase w swojej aplikacji
Usługi Firebase (takie jak Cloud Firestore, uwierzytelnianie, baza danych w czasie rzeczywistym, zdalna konfiguracja i inne) są dostępne do importowania w ramach poszczególnych podpakietów.
Poniższy przykład pokazuje, jak można użyć pakietu SDK Cloud Firestore Lite do pobrania listy danych.
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; }
Krok 4 : Użyj pakietu modułów (webpack/Rollup) w celu zmniejszenia rozmiaru
Zestaw SDK Firebase Web SDK został zaprojektowany do współpracy z pakietami modułów w celu usunięcia nieużywanego kodu (wstrząsanie drzewem). Zdecydowanie zalecamy stosowanie tego podejścia w przypadku aplikacji produkcyjnych. Narzędzia takie jak Angular CLI , Next.js , Vue CLI lub Create React App automatycznie obsługują pakowanie modułów dla bibliotek zainstalowanych przez npm i zaimportowanych do bazy kodu.
Więcej informacji znajdziesz w naszym przewodniku Korzystanie z pakietów modułów w Firebase .
Dostępne usługi Firebase dla Internetu
Teraz, gdy jesteś już skonfigurowany do korzystania z Firebase, możesz zacząć dodawać i używać dowolnych z poniższych dostępnych usług Firebase w swojej aplikacji internetowej.
Poniższe polecenia pokazują, jak importować biblioteki Firebase zainstalowane lokalnie za pomocą npm
. Aby zapoznać się z alternatywnymi opcjami importu, zobacz dokumentację dostępnych bibliotek .
Następne kroki
Dowiedz się więcej o Firebase:
Poznaj przykładowe aplikacje Firebase .
Zdobądź praktyczne doświadczenie dzięki Firebase Web Codelab .
Poznaj otwarty kod źródłowy w GitHub .
Przejrzyj obsługiwane środowiska dla pakietu SDK Firebase JavaScript.
Przyspiesz rozwój dzięki dodatkowym bibliotekom open source obsługiwanym przez Firebase, takim jak AngularFire , RxFire i FirebaseUI dla sieci Web .
Przygotuj się do uruchomienia aplikacji:
- Skonfiguruj alerty budżetowe dla swojego projektu w Google Cloud Console.
- Monitoruj panel użytkowania i rozliczeń w konsoli Firebase, aby uzyskać ogólny obraz wykorzystania projektu w wielu usługach Firebase.
- Przejrzyj listę kontrolną uruchamiania Firebase .