firestore-react-library
v0.0.1
Published
React library to communicate with firestore
Downloads
64
Readme
Firestore React
React components to handle Google Firebase Firstore database.
What's in the box?
There are 3 components that are our building blocks to consume and modify your data stored in Firestore.
FirestoreProvider
Wrap your app with this component, supply it with your firebase config and you're ready to start pulling data.
FirstoreCollection
The component which would pull docs within a given collection.
FirestoreDocument
The component which would pull a specific document.
Models
To work with either the <FirestoreCollection />
or <FirestoreDocument />
components, you'd also need to define the model representing your collection/document. To do so you need to simply extend the DocumentModel
and CollectionModel
classes to your collections and documents' structures,
A simple document model
type MyDocType = { name: string; value?: number };
export class MyDocModel extends DocumentModel<MyDocType> {
path = 'users';
}
This tells us that the path of this document type is users/
and that its type includes a name
(string) and a price
(optional number).
A document model with default values
type MyDocType = { name: string; value?: number };
export class MyDocModel extends DocumentModel<MyDocType> {
path = 'users';
defaults = {
name: 'unknown',
price: 0
}
}
The defaults
prop is used to fallback each field in the retrieved document, to its responsive default value, in case the field is undefined
.