Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/invertase/tanstack-query-firebase
TanStack Query hooks for managing asynchronous operations with Firebase.
https://github.com/invertase/tanstack-query-firebase
analytics firebase react react-hooks react-query reactjs tanstack-query
Last synced: 3 days ago
JSON representation
TanStack Query hooks for managing asynchronous operations with Firebase.
- Host: GitHub
- URL: https://github.com/invertase/tanstack-query-firebase
- Owner: invertase
- License: apache-2.0
- Created: 2021-09-10T15:09:07.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-01-14T15:25:17.000Z (8 days ago)
- Last Synced: 2025-01-19T17:48:36.549Z (3 days ago)
- Topics: analytics, firebase, react, react-hooks, react-query, reactjs, tanstack-query
- Language: TypeScript
- Homepage: https://invertase.docs.page/tanstack-query-firebase
- Size: 980 KB
- Stars: 399
- Watchers: 9
- Forks: 71
- Open Issues: 65
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
TanStack Query Firebase
A set of TanStack Query hooks integrating with Firebase.
Installation •
Documentation •
License
TanStack Query Firebase provides a set of hooks for handling asynchronous tasks with Firebase in your applications.
> [!IMPORTANT]
> This project is currently a work in progress.
> Looking for React Query Firebase? Check out the [old branch](https://github.com/invertase/tanstack-query-firebase/tree/react-query-firebase).
## Why use this library?
When managing Firebase’s asynchronous API calls within your application, state synchronization can become cumbersome in most applications. You will commonly find yourself handling loading states, error states, and data synchronization manually.
This library provides a hands-off approach to these problems, by leveraging the popular [TanStack Query](https://tanstack.com/query/latest) project. Out of the box, you get:
- **Automatic Caching**: Avoid redundant Firebase calls with built-in caching.
- **Out-of-the-box Synchronization**: TanStack Query keeps your UI in sync with the Firebase backend effortlessly.
- **Background Updates**: Fetch and sync data seamlessly in the background without interrupting the user experience.
- **Error Handling & Retries**: Get automatic retries on failed Firebase calls, with robust error handling baked in.
- **Dev Tools for Debugging**: Leverage the React Query Devtools to gain insights into your data-fetching logic and Firebase interactions.
By combining Firebase with TanStack Query, you can make your app more resilient, performant, and scalable, all while writing less code.
## Installation
This project expects you have `firebase` installed as a peer dependency. If you haven't done so already, install `firebase`:
```bash
npm i --save firebase
```
Next, install specific packages for your framework of choice:
### React
```
npm i --save @tanstack/react-query @tanstack-query-firebase/react
```
See the [Documentation](https://invertase.docs.page/tanstack-query-firebase/react) for more information on how to use the library.
## Status
The status of the following Firebase services and frameworks are as follows:
- ✅ Ready for use
- 🟠 Work in progress
- () Not yet started
| Module | React | Vue | Solid | Angular | Svelte |
|----------------|:------:|:-----:|:-----:|:-------:|:------:|
| analytics | | | | | |
| app-check | | | | | |
| auth | 🟠 | | | | |
| database | | | | | |
| data-connect | ✅ | | | | |
| firestore | 🟠 | | | | |
| firestore/lite | | | | | |
| functions | | | | | |
| installations | | | | | |
| messaging | | | | | |
| performance | | | | | |
| remote-config | | | | | |
| vertexai | | | | | |
## License
- See [LICENSE](/LICENSE)
---
Built and maintained by Invertase.