Google cam kết thúc đẩy công bằng chủng tộc cho Cộng đồng người da đen. Xem cách thực hiện.

Thêm Firebase vào dự án JavaScript của bạn

Làm theo hướng dẫn này để sử dụng SDK JavaScript của Firebase trong ứng dụng web của bạn hoặc làm ứng dụng khách để người dùng cuối truy cập, ví dụ: trong máy tính để bàn Node.js hoặc ứng dụng IoT.

Bước 1: Tạo một dự án căn cứ hỏa lực và đăng ký ứng dụng của bạn

Trước khi có thể thêm Firebase vào ứng dụng JavaScript của mình, bạn cần tạo một dự án Firebase và đăng ký ứng dụng của mình với dự án đó. Khi đăng ký ứng dụng của mình với Firebase, bạn sẽ nhận được đối tượng cấu hình Firebase mà bạn sẽ sử dụng để kết nối ứng dụng của mình với tài nguyên dự án Firebase.

Thăm Hiểu căn cứ hỏa lực dự án để tìm hiểu thêm về các dự án căn cứ hỏa lực và thực hành tốt nhất để thêm các ứng dụng cho các dự án.

Nếu bạn chưa có một dự án JavaScript và chỉ muốn thử ra một sản phẩm căn cứ hỏa lực, bạn có thể tải về một trong chúng tôi mẫu QuickStart .

Bước 2: Cài đặt SDK và khởi tạo căn cứ hỏa lực

Trang này mô tả hướng dẫn cài đặt cho phiên bản 9 của căn cứ hỏa lực JS SDK, trong đó sử dụng một mô-đun Javascript định dạng.

Quy trình này sử dụng NPM và đòi hỏi bundlers mô-đun hoặc JavaScript framework cụ vì SDK v9 được tối ưu hóa để làm việc với bundlers mô-đun để loại bỏ mã không sử dụng (cây lắc) và kích thước giảm SDK.

  1. Cài đặt Firebase bằng npm:

    npm install firebase
  2. Khởi tạo Firebase trong ứng dụng của bạn và tạo đối tượng Ứng dụng Firebase:

    import { initializeApp } from 'firebase/app';
    
    // TODO: Replace the following with your app's Firebase project configuration
    const firebaseConfig = {
      //...
    };
    
    const app = initializeApp(firebaseConfig);
    

    Ứng dụng Firebase là một đối tượng giống như vùng chứa lưu trữ cấu hình chung và chia sẻ xác thực trên các dịch vụ Firebase. Sau khi khởi tạo đối tượng Ứng dụng Firebase trong mã của mình, bạn có thể thêm và bắt đầu sử dụng các dịch vụ Firebase.

Bước 3: Tiếp cận căn cứ hỏa lực trong ứng dụng của bạn

Các dịch vụ Firebase (như Cloud Firestore, Xác thực, Cơ sở dữ liệu thời gian thực, Cấu hình từ xa, v.v.) có sẵn để nhập trong các gói con riêng lẻ.

Ví dụ bên dưới cho thấy cách bạn có thể sử dụng Cloud Firestore Lite SDK để truy xuất danh sách dữ liệu.

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;
}

Bước 4: Sử dụng một mô-đun bundler (webpack / Rollup) để giảm kích thước

SDK Web Firebase được thiết kế để hoạt động với các trình gói mô-đun để xóa mọi mã không sử dụng (rung cây). Chúng tôi thực sự khuyên bạn nên sử dụng phương pháp này cho các ứng dụng sản xuất. Các công cụ như các góc CLI , Next.js , Vue CLI , hoặc Tạo Phản ứng App tự động xử lý mô-đun bó cho các thư viện cài đặt thông qua NPM và nhập khẩu vào codebase của bạn.

Xem hướng dẫn của chúng tôi Sử dụng bundlers mô-đun với căn cứ hỏa lực để biết thêm thông tin.

Các dịch vụ Firebase có sẵn cho web

Bây giờ bạn đã thiết lập để sử dụng Firebase, bạn có thể bắt đầu thêm và sử dụng bất kỳ dịch vụ Firebase khả dụng nào sau đây trong ứng dụng web của mình.

Bước tiếp theo

Tìm hiểu về Firebase: