# react-redux-firebase wires Firebase listeners into Redux, and points new projects at another library

> react-redux-firebase v4.0.0 binds Firebase listeners to a Redux store through React hooks or higher order components. Its README steers new projects to reactfire when Firebase data does not need to reach Redux, its non-npm fallback link resolves to a different package, and its test scripts only run inside the Firebase emulators.

**prescottprue/react-redux-firebase** — Redux bindings for Firebase. Includes React Hooks and Higher Order Components.

- Repository: https://github.com/prescottprue/react-redux-firebase
- Website: https://react-redux-firebase.com
- Stars: 2,531 · Forks: 541
- Language: JavaScript
- License: MIT
- Published: 2026-09-28 · Updated: 2026-09-28 · Language: en
- Canonical page: https://hysenlabs.com/projects/prescottprue-react-redux-firebase

## The usage note points new projects at reactfire

The first substantive paragraph of this README is a recommendation to use something else. It says that if you are starting a new project, or you are not required to have your Firebase data loaded into Redux, you might want to give [reactfire](https://github.com/FirebaseExtended/reactfire) a try before trying react-redux-firebase, and it links to a short article the author wrote about how and why. That sentence is the clearest statement of scope anywhere in the repository, and it is worth reading as the library's real admission criteria: you adopt this when the store is where your components read from anyway.

The axis the note draws is not styling or bundle size. It is whether Firebase data has to be in Redux at all. Once it is, the rest of the feature list follows from that choice: a population capability compared to mongoose populate or a SQL JOIN, integrations with redux-thunk and redux-observable, and server side rendering support. Those are things you reach for when the store is the center of the app rather than a cache beside it.

One inconsistency sits right at the top. The repository description calls the project Redux bindings for Firebase that include React Hooks and Higher Order Components. The README's own subtitle line mentions only the higher order component. Every example in the document is built on the hooks, `useFirebaseConnect` and `useFirebase`, with the HOCs described as the alternative path, so the subtitle is the one that is out of date.

## The unpkg fallback resolves to a different package

Installation is one command, and it assumes npm:

```bash
npm install --save react-redux-firebase
```

The next paragraph is where the documentation goes wrong. It says the command assumes you are using npm, and that if you are not you can access the library on unpkg, download it, or point your package manager to it. The unpkg address it hands you is `https://unpkg.com/redux-firestore@latest/dist/redux-firestore.min.js`, which is the browser bundle of redux-firestore, the separate package the README later recommends for Firestore work. A reader following the instruction for a CDN-based setup therefore loads a different library than the one the document is about, and the mistake is in the only sentence that gives a non-npm path.

There is no second address to fall back on, and no documented global name for a browser bundle. What the package does declare is a CommonJS entry, an ES module entry and a TypeScript declaration file:

```json
  "main": "lib/index.js",
  "module": "es/index.js",
  "typings": "./index.d.ts",
  "sideEffects": false,
```

So the file layout is clear for bundler-based consumers, while the CDN story is left resting on a link that points elsewhere. If you are evaluating this library in a setup without npm, verify the entry point yourself rather than following that paragraph.

## Two 3.x tags hours apart, then nothing until 2026

The release history is short and uneven. Three tags are visible: v3.10.1 on 2021-11-23, v3.11.0 on the same day a few hours later, and v4.0.0 on 2026-06-11. Between the last 3.x tag and v4 there is a gap of more than four years with no tag at all. Commits have continued since: the most recent push to the default branch is dated 2026-10-03, four months after v4.0.0 shipped, which means main has moved on without a release cut. The root package.json is at version 4.0.0, so the manifest and the newest tag agree.

Three major lines coexist, and the README only explains how to get one of them. If you need support for react-redux before v6 or before the React context API, the answer is the v2 line, installed as its own range:

```bash
npm i --save react-redux-firebase^@2.5.0
```

The caret keeps you inside 2.x. There is no comparable note about the v3 to v4 boundary, so a team that pinned 3.11.0 in 2021 has to work out the upgrade path from the changelog rather than from the installation section. The repository is not archived and the license is MIT, with the license text at the root as LICENSE.md.

## Every test script runs through the Firebase emulators

There is no plain test command. The test scripts wrap a call to the Firebase emulator runner:

```json
  "emulators:exec": "firebase emulators:exec --only database,auth,firestore --project rrf-test",
  "build:commonjs": "cross-env BABEL_ENV=commonjs babel src --out-dir lib --source-maps",
  "build:es": "cross-env BABEL_ENV=es babel src --out-dir es --source-maps",
```

`test`, `test:watch` and `test:cov` each hand their vitest invocation to that runner, so starting the database, auth and firestore emulators is part of running the suite, not an optional convenience. The project id is hardcoded to `rrf-test`, and the root holds both `firebase.json` and `database.rules.json`, which is what the emulators read. A contributor therefore needs the Firebase CLI and three emulators before any assertion executes, and anyone wiring this into continuous integration inherits that dependency rather than installing a package and running tests.

The rest of the toolchain is ordinary and split by concern: Babel with two environments produces the two build outputs, Biome handles checking, linting and formatting through `biome.jsonc`, Husky installs git hooks on install through the prepare script, and Renovate is configured in `renovate.json`. Coverage is wired through `codecov.yml` and a Code Climate config at the root.

## The tarball ships source, two builds and a hand-kept index.d.ts

The published files list is worth reading closely: lib, es, src and index.d.ts. Consumers receive the CommonJS output, the ES module output, the untranspiled source, and a declaration file that sits at the repository root rather than inside a build directory. The typings entry points at `./index.d.ts`, so the types are maintained as their own file and are shipped alongside two compiled copies of the same code.

Publishing runs a clean build. The prepack script is clean followed by build, and clean removes es, lib and coverage with rimraf, while build chains the two Babel passes, each writing source maps. That means every publish recompiles from scratch, which is the safe arrangement, and it also means the source map files ship with the package.

`sideEffects` is false, which tells a bundler that importing a module for effect alone is unnecessary and unused re-exports can be dropped. For a library whose own documentation leans on side-effect imports such as `firebase/database` and `firebase/auth` in the application setup, that flag is a claim about the package rather than about the app around it, and it is the kind of thing to check against how your bundler handles the Firebase SDK before you rely on tree shaking here.

## One connect array, two notations and two leading-slash styles

Listeners are declared as an array, and the array accepts more than one shape. The list example passes a bare string:

```jsx
  useFirebaseConnect([
    'todos' // { path: '/todos' } // object notation
  ])
```

The detail-page example passes an object built from a route parameter, with a comment marking the string form as equivalent:

```jsx
  useFirebaseConnect([
    { path: `todos/${todoId}` } // create todo listener
  ])
```

Read together, the two examples show the object form as the one that carries extra options, which matches the documented population feature that joins a path against another collection the way mongoose populate or a SQL JOIN does. They also show a small inconsistency: the first comment writes `/todos` with a leading slash while the second writes `todos/${todoId}` without one, and neither example says which form is canonical.

The instance itself reaches components through `useFirebase`, and the route parameter comes from `useParams` in react-router-dom matching `todos/:todoId`. The hook equivalents are named alongside their higher order component twins, `useFirebaseConnect` with `firebaseConnect` and `useFirestoreConnect` with `firestoreConnect`, and the binding is tied to mounting and unmounting, so a component that declares a path gets a listener when it appears and loses it when it goes away.

## Firestore is promised in the feature list and handed to another package

The feature list claims full Firebase platform support including the real time database, Firestore and Storage. The Firestore section then tells you to use a different library for it, saying that redux-firestore integrates with this one and lets you run the real time database and Firestore side by side. What react-redux-firebase contributes on the Firestore side is the `firestoreConnect` HOC, the twin of `firebaseConnect`, and the matching `useFirestoreConnect` hook named in the same feature bullet.

The setup block makes the split concrete. Alongside the required imports for the database and auth SDK there are two commented lines, one noting that importing `firebase/firestore` is needed if using firestore and one noting that `createFirestoreInstance` and `firestoreReducer` are needed from redux-firestore for the same reason. So a Firestore user ends up installing and wiring a second Redux package before the first one can hold those queries.

That paragraph is also where this README stops. The Firestore section explains that `firestoreConnect` exists for easy setting and unsetting of l, and the sentence is never finished, so the reader is left with the hook names and the setup imports but no written account of what the Firestore path does on mount. The same document links out to dedicated pages on the documentation site for population and for react-native, which is where the missing explanation sits, though the repository text itself does not point at a specific page for this.

## The docs site is built from this repository

The documentation is not hosted somewhere separate. The root holds `book.json`, `SUMMARY.md`, a `docs/` directory and a `CNAME` file, which is the layout a book-style generator consumes, and the CNAME matches the homepage the manifest records. Feature bullets link into that site by path, for instance a populate page and a react-native integration page with anchors for native modules and for the web SDK.

Examples live next to the library as well. There is a simple example on CodeSandbox, a snippets directory under `examples/`, and a complete Material UI example at `examples/complete/material` that is deployed to a public demo site. Nothing in the README tells you how to run the complete example locally, so the demo site is the only documented way to see the library in a finished application.

A PATRONS file sits at the root alongside the contributing guide, the code of conduct and the changelog. If you want to know whether a question has an answer, the changelog and the docs directory in this repository are the places to look, because the README itself covers the happy path, the older react-redux line and the Firestore delegation, and then breaks off.

## Conclusion

This library earns its place in an app that has already decided that Firebase data belongs in a Redux store, because the ordered and data projections, the populate-style joins and the middleware integrations all assume that store. It does not suit a greenfield project that only needs Firebase in React, which is the exact case its usage note sends elsewhere. Before adopting it, check three things: whether you are on the v4 line and what your react-redux version requires, since v2 exists for react-redux before v6 and before the context API, whether Firestore matters to you, since the Firestore setup imports a reducer and an instance factory from redux-firestore, and whether your CI can start the database, auth and firestore emulators under the fixed project id rrf-test, because every test script depends on that.

## FAQ

### What does react-redux-firebase actually add on top of Firebase?

It moves Firebase data into a Redux store. You include the firebaseReducer when creating the store, pass dispatch and your Firebase instance to ReactReduxFirebaseProvider, then read data through hooks such as useFirebaseConnect or through higher order components such as firebaseConnect.

### Should I start a new project with react-redux-firebase?

The usage note at the top of the README suggests trying reactfire first if you are starting a new project or do not need your Firebase data loaded into Redux. react-redux-firebase is aimed at applications that keep that data in the store.

### How do I install react-redux-firebase without npm?

The README points non-npm users at unpkg, but the address it gives resolves to redux-firestore rather than to react-redux-firebase, so it serves a different package. The manifest declares lib/index.js for CommonJS, es/index.js for ES modules and ./index.d.ts for types.

### What does it take to run the react-redux-firebase test suite?

The test scripts hand their vitest invocation to the Firebase emulator runner, which starts the database, auth and firestore emulators under the project id rrf-test. You need the Firebase CLI and those emulators before any assertion runs.

### Can react-redux-firebase handle Firestore by itself?

The Firestore setup imports createFirestoreInstance and firestoreReducer from redux-firestore, which the README recommends so the real time database and Firestore can run side by side. This package supplies firestoreConnect and useFirestoreConnect for the listener side.

## Sources

- [License: MIT](https://github.com/prescottprue/react-redux-firebase/blob/main/LICENSE)
- [prescottprue/react-redux-firebase on GitHub](https://github.com/prescottprue/react-redux-firebase)
- [Project website](https://react-redux-firebase.com)
- [README](https://github.com/prescottprue/react-redux-firebase/blob/main/README.md)
- [Releases](https://github.com/prescottprue/react-redux-firebase/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/prescottprue-react-redux-firebase