- 🤌 Just the right amount of abstraction.
- ⚛️ Built natively with React hooks to manage state.
- 🕹️ Minimal boilerplate — take back full control where you need it.
- 🔌 Strong integration of TypeScript types for functions, data, and more.
- ☁️ Simplified server logic for Callables, batch execution, and more.
- 📱 High consistency between
react
andreact-native
. - ✅ Reliance on well adopted libraries:
- 🔥
react-firebase-hooks
for web. - ☄️
react-native-firebase
for native.
- 🔥
1 — Define Realtime Connections
Firebridge mixes the power of Firebase’s Cloud Firestore and React hooks to help you express realtime platform logic in a very simple format. We give you a simple format for defining typed realtime connections to Cloud Firestore.This format might look familiar. Under the hood on
@firebridge/web
, we’re
using
react-firebase-hooks
with a few small extensions on the syntax. We’ve also implemented the same
hooks for @firebridge/native
.useDocument
has a dependency array similar to useEffect
. By providing a value, we can ensure the ref is updated when the value changes. This is useful for when we want to maintain a realtime connection to a document that depends on a value that changes over time.
It’s also common to include the user’s ID as part of the path to a document. This makes writing Firestore security rules much easier. In this case, the ref can be provided as a function which accepts the current user’s ID as the first argument.
timeCreated
in the documents. This makes sorting by creation date very easy.
2 — Cloud Callables
Sometimes we need to run an operation on the server before a write can occur. Let’s say when a user posts a review, we want to make sure that the review doesn’t contain any explicit content. First, we can create a utility to save reviews to the database. We’ll use thefirestoreSet
utility from @firebridge/cloud
to create a function that will save the review to the database. We’ll ask it to include metadata like a FirestoreTimestamp for the timeCreated
to make querying easy.
Cloud
Cloud
useCallable
hook. We can even include the same type definitions so that the request and response are typed correctly.