ReactFire 
ReactJS is a framework for building large, complex user
interfaces. Firebase complements it perfectly by providing an
easy-to-use, realtime data source for populating the state of React components. With ReactFire, it
only takes a few lines of JavaScript to integrate Firebase data into React apps via the
ReactFireMixin.
Table of Contents
- Getting Started With Firebase
- Downloading ReactFire
- Documentation
- Examples
- Migration Guides
- Contributing
Getting Started With Firebase
ReactFire requires Firebase in order to sync and store data. Firebase is a suite of integrated products designed to help you develop your app, grow your user base, and earn money. You can sign up here for a free account.
Downloading ReactFire
In order to use ReactFire in your project, you need to include the following files in your HTML:
<!-- React -->
<script src="https://fb.me/react-15.0.1.min.js"></script>
<script src="https://fb.me/react-dom-15.0.1.min.js"></script>
<!-- Firebase -->
<script src="https://www.gstatic.com/firebasejs/3.0.3/firebase.js"></script>
<!-- ReactFire -->
<script src="https://cdn.firebase.com/libs/reactfire/1.0.0/reactfire.min.js"></script>
You can also install ReactFire via npm or Bower. If downloading via npm, you will have to install
React and Firebase separately (that is, they are peerDependencies):
$ npm install reactfire react firebase --save
On Bower, the React and Firebase dependencies will be downloaded automatically alongside ReactFire:
$ bower install reactfire --save
Documentation
Examples
Migration Guides
Contributing
If you'd like to contribute to ReactFire, you'll need to run the following commands to get your environment set up:
$ git clone https://github.com/firebase/reactfire.git
$ cd reactfire # go to the reactfire directory
$ npm install -g gulp # globally install gulp task runner
$ npm install -g bower # globally install Bower package manager
$ npm install # install local npm build / test dependencies
$ bower install # install local JavaScript dependencies
$ gulp watch # watch for source file changes
gulp watch will watch for changes in the /src/ directory and lint, concatenate, and minify the
source files when a change occurs. The output files - reactfire.js and reactfire.min.js - are
written to the /dist/ directory.
You can run the test suite by navigating to file:///path/to/reactfire/tests/index.html or via the
command line using gulp test.