redux-firebase

Redux bindings for Firebase

Why?

Provide Framework/library agnostic Firebase bindings for redux similar to those available in react-redux-firebase and other similar libraries.

Features

Integrated into redux
Support for updating and nested props
Population capability (similar to mongoose's populate or SQL's JOIN)
Out of the box support for authentication (with auto load user profile)
Firebase Storage Support
Support small data ( using value ) or large datasets ( using child_added, child_removed, child_changed )
queries support ( orderByChild, orderByKey, orderByValue, orderByPriority, limitToLast, limitToFirst, startAt, endAt, equalTo right now )
Automatic binding/unbinding
Declarative decorator syntax for React components
Tons of integrations including redux-thunk and redux-observable
Action Types and other Constants exported for external use (such as in redux-observable)
Firebase v3+ support
Server Side Rendering Support
react-native support using native modules or web sdk

Install

npm install --save redux-firebase

Use

Note: If you are just starting a new project, you may want to use v2.0.0 since it is has an even easier syntax. For clarity on the transition, view the v1 -> v2 migration guide

Include reactReduxFirebase in your store compose function and firebaseStateReducer in your reducers:

import { createStore, combineReducers, compose } from 'redux'
import { reduxFirebase, firebaseReducer } from 'react-redux-firebase'
import * as firebase from 'firebase'

// Add Firebase to reducers
const rootReducer = combineReducers({
  firebase: firebaseReducer
})

// Firebase config
const config = {
  apiKey: '<your-api-key>',
  authDomain: '<your-auth-domain>',
  databaseURL: '<your-database-url>',
  storageBucket: '<your-storage-bucket>'
}
const rfConfig = { userProfile: 'users' } // react-redux-firebase config

// initialize firebase instance
firebase.initializeApp(config) // <- new to v2.*.*

// Add reduxReduxFirebase to compose
const createStoreWithFirebase = compose(
  reduxFirebase(firebase, rfConfig), // firebase instance as first argument
)(createStore)

// Create store with reducers and initial state
const store = createStoreWithFirebase(rootReducer, initialState)

Discussion

Join us on the redux-firebase gitter.

FAQ

How is this different than react-redux-firebase?

The future plan for is for react-redux-firebase to be powered by this library. redux-firebase will contain the redux specific internal logic which was originally created for react-redux-firebase. In this way, redux-firebase is front end framework agnostic,