React-redux-firebase: Compatibility with react-redux-router ?

[MentalGear]

Thanks for your work and looks like a great package, however will it work seamless with react-router-redux as well ?
https://github.com/reactjs/react-router-redux

[prescottprue]

react-redux-firebase does not affect anything with routing choices. It keeps Firebase in sync with your redux store, and provides a Higher Order Component (firebaseConnect) for ease of use with react components (provides this.props.firebase).

If you have any questions while integrating the two feel free to reach out over the gitter room

[MentalGear]

Thanks for the quick reply, Prescott. Only thing I'm worried about (and I'm writing it here as others might also be interested) is that, as react-router-redux also saves it's routing state in redux, the routing state could end up in firebase.

Sry if that sounds noob-ish, but I'm new to react and trying to chose the best set-up.

[prescottprue]

So things actually work the other way.

You decide what is "synced" with firebase by providing paths within the firebaseConnect HOC (which creates listeners). Nothing in your state is automatically synced, and it is all placed within whatever namespace you give to the reducer (i.e. "firebase") if you follow the use instructions:

import { createStore, combineReducers, compose } from 'redux'
import { reactReduxFirebase, firebaseStateReducer } from 'react-redux-firebase'

// Add Firebase to reducers
const rootReducer = combineReducers({
  firebase: firebaseStateReducer, // placing the reducer under the "firebase" namespace within redux
  // other: someOtherReducer // this is where you would place other reducers
})

// Add redux Firebase to compose
const createStoreWithFirebase = compose(
  reactReduxFirebase(config, { userProfile: 'users' }),
)(createStore)

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

This is actually by design too as the most common usage of redux is to store other application state. I wrote a medium article that might help explain that is linked in the README faq.

[prescottprue]

Also, if you want to get up and running quickly using this library:

Check out generator-react-firebase which is a command line tool that helps you start projects (a yeoman generator).