ReactFire

Hooks that make it easy to interact with Firestore, Realtime Database, Authentication, and Storage. Note, every reactfire hook throws a Promise until it has connected to Firebase. Wrap your components in React's Suspense, or, if you don't want to deal with Suspense, pass an initial value to a reactfire hook. Example.

Usage

Authentication

useUser(auth: auth.Auth, options?: ReactFireOptions): User

Firestore

function useFirestoreDoc(
  ref: firestore.DocumentReference,
  options?: ReactFireOptions
): firestore.DocumentSnapshot;

function useFirestoreCollection(
  ref: firestore.CollectionReference,
  options?: ReactFireOptions
): firestore.QuerySnapshot;

Realtime Database

function useDatabaseObject(
  ref: database.Reference,
  options?: ReactFireOptions
): QueryChange;

function useDatabaseList(
  ref: database.Reference | database.Query,
  options?: ReactFireOptions
): QueryChange[];

Cloud Storage for Firebase

function useStorageTask(
  task: storage.UploadTask,
  ref: storage.Reference,
  options?: ReactFireOptions
): storage.UploadTaskSnapshot;

function useStorageDownloadURL(
  ref: storage.Reference,
  options?: ReactFireOptions
): string;

For development

yarn install
cd into the reactfire/reactfire directory. run yarn run watch.
In a new terminal, cd into the reactfire/sample-simple directory. run yarn start.
Head over to https://localhost:3000 to see the running sample

Testing

cd into the reactfire/reactfire directory
run yarn test

1.7 KiB Raw Blame History