kylefang/reactfire
1
0
Fork 0
mirror of https://github.com/zhigang1992/reactfire.git synced 2026-04-18 12:13:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #13 from firebase/jw-catapult

Browse Source 
Repo cleanup to comply with new catapult deploy process
This commit is contained in:
Jacob Wenger
2014-08-25 23:23:50 -07:00
parent 112bee2da4 a8ba0bc344
commit 623ae0f3a2
13 changed files with 61 additions and 445 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
.gitignore vendored
View File

@@ -1,4 +1,4 @@
node_modules
bower_components
firebase.json
dist/
node_modules/
bower_components/
tests/coverage

2
.travis.yml
View File

@@ -6,4 +6,4 @@ install:
- npm install
- bower install
script:
- npm test
- npm run travis

46
CHANGELOG.md
View File

@@ -1,46 +0,0 @@
v0.1.6
-------------
Release Date: 2014-06-29
* Fixed issue when binding to Firebase limit() query
* Added error checking
* Added basic test suite
* Added distribution files to Firebase CDN
* Change Bower package name to reactfire (used to be ReactFire)
v0.1.5
-------------
Release Date: 2014-05-23
* Used safe isArray() function thanks to @mjackson
v0.1.4
-------------
Release Date: 2014-05-13
* Added node.js support
v0.1.3
-------------
Release Date: 2014-05-03
* Bug fix for misnamed variable in _toArray() method (submitted by @danielmahal)
* Added gulp integration to lint, minify, and test code
v0.1.2
-------------
Release Date: 2014-05-02
* Fixed typo in bower.json
v0.1.1
-------------
Release Date: 2014-05-02
* Better implementation of _isArray() and _toArray() helpers
v0.1.0
-------------
Release Date: 2014-04-30
* First stable release of the ReactFireMixin

46
README.md
View File

@@ -1,11 +1,17 @@
# ReactFire
[![Build Status](https://travis-ci.org/firebase/reactfire.svg)](https://travis-ci.org/firebase/reactfire)
[![Build Status](https://travis-ci.org/firebase/reactfire.svg?branch=master)](https://travis-ci.org/firebase/reactfire)
[![GitHub version](https://badge.fury.io/gh/firebase%2Freactfire.svg)](http://badge.fury.io/gh/firebase%2Freactfire)
[ReactJS](http://facebook.github.io/react/) is a framework for building large, complex user interfaces. [Firebase](http://www.firebase.com/?utm_source=reactfire) 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 into React apps via the `ReactFireMixin`.
[ReactJS](http://facebook.github.io/react/) is a framework for building large, complex user
interfaces. [Firebase](http://www.firebase.com/?utm_source=reactfire) 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 into React apps via
the `ReactFireMixin`.
[Read our blog post](https://firebase.com/blog/2014-05-01-using-firebase-with-react.html?utm_source=reactfire) on using Firebase with React and [check out our live Todo app demo](https://reactfiretodoapp.firebaseapp.com/) to get started!
[Read our blog post](https://firebase.com/blog/2014-05-01-using-firebase-with-react.html?utm_source=reactfire)
on using Firebase with React and [check out our live Todo app demo](https://reactfiretodoapp.firebaseapp.com/)
to get started!
## Downloading ReactFire
@@ -17,15 +23,20 @@ In order to use the `ReactFireMixin` in your project, you need to include the fo
<script src="http://fb.me/JSXTransformer-0.10.0.js"></script>
<!-- Firebase -->
<script src="https://cdn.firebase.com/js/client/1.0.17/firebase.js"></script>
<script src="https://cdn.firebase.com/js/client/1.0.21/firebase.js"></script>
<!-- ReactFire -->
<script src="https://cdn.firebase.com/libs/reactfire/0.1.6/reactfire.min.js"></script>
```
Use the URL above to download both the minified and non-minified versions of ReactFire from the Firebase CDN. You can also download them from the `/dist/` directory of this GitHub repository. [Firebase](https://www.firebase.com/docs/web-quickstart.html?utm_source=reactfire) and [React](http://facebook.github.io/react/downloads.html) can be downloaded directly from their respective websites.
Use the URL above to download both the minified and non-minified versions of ReactFire from the
Firebase CDN. You can also download them from the
[releases page of this GitHub repository](https://github.com/firebase/reactfire/releases).
[Firebase](https://www.firebase.com/docs/web/quickstart.html?utm_source=geofire-js) and
[React](http://facebook.github.io/react/downloads.html) can be downloaded directly from their
respective websites.
You can also install ReactFire via npm or Bower and the dependencies will be downloaded automatically:
You can also install ReactFire via npm or Bower and its dependencies will be downloaded automatically:
```bash
$ npm install reactfire --save
@@ -37,7 +48,8 @@ $ bower install reactfire --save
## Getting Started with Firebase
ReactFire requires Firebase in order to store data. You can [sign up here](https://www.firebase.com/signup/?utm_source=reactfire) for a free account.
ReactFire requires Firebase in order to store data. You can
[sign up here](https://www.firebase.com/signup/?utm_source=reactfire) for a free account.
## Usage
@@ -56,7 +68,8 @@ The following APIs will then be available from the `this` object inside of `Exam
### bindAsArray(firebaseRef, bindVar)
Creates a binding between Firebase and the inputted bind variable as an array. The Firebase reference will be stored in `this.firebaseRefs[bindVar]`.
Creates a binding between Firebase and the inputted bind variable as an array. The Firebase
reference will be stored in `this.firebaseRefs[bindVar]`.
```javascript
var firebaseRef = new Firebase("https://<YOUR_FIREBASE>/");
@@ -65,7 +78,8 @@ this.bindAsArray(firebaseRef, "items");
### bindAsObject(firebaseRef, bindVar)
Creates a binding between Firebase and the inputted bind variable as an object. The Firebase reference will be stored in `this.firebaseRefs[bindVar]`.
Creates a binding between Firebase and the inputted bind variable as an object. The Firebase
reference will be stored in `this.firebaseRefs[bindVar]`.
```javascript
var firebaseRef = new Firebase("https://<YOUR_FIREBASE>/");
@@ -74,7 +88,9 @@ this.bindAsObject(firebaseRef, "items");
### unbind(bindVar)
Removes the binding between Firebase and the inputted bind variable. This removes the stored Firebase reference in `this.firebaseRefs[bindVar]` and cleans up any event handlers associated with that Firebase reference.
Removes the binding between Firebase and the inputted bind variable. This removes the stored
Firebase reference in `this.firebaseRefs[bindVar]` and cleans up any event handlers associated
with that Firebase reference.
```javascript
this.unbind("items");
@@ -82,7 +98,8 @@ this.unbind("items");
## Contributing
If you'd like to contribute to ReactFire, you'll need to run the following commands to get your environment set up:
If you'd like to contribute to ReactFire, you'll need to run the following commands to get your
environment set up:
```bash
$ git clone https://github.com/firebase/reactfire.git
@@ -94,6 +111,9 @@ $ 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.
`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`.
You can run the test suite by navigating to `file:///path/to/reactfire/tests/index.html` or via the
command line using `gulp test`.

4
bower.json
View File

@@ -1,7 +1,7 @@
{
"name": "reactfire",
"description": "Firebase mixin for ReactJS",
"version": "0.1.6",
"version": "0.0.0",
"authors": [
"Firebase <support@firebase.com>"
],
@@ -29,7 +29,7 @@
"firebase.json",
"package.json",
"gulpfile.js",
"release.sh"
"changelog.txt"
],
"dependencies": {
"react": "~0.10.0",

16
build/header
View File

@@ -1,10 +1,12 @@
// ReactFire is an officially supported ReactJS mixin for Firebase. Firebase
// provides your React app with a persistent, realtime backend to effortlessly
// keep all of your clients in sync!
//
// ReactFire 0.1.6
// https://github.com/firebase/reactfire/
// License: MIT
/*!
* ReactFire is an open-source JavaScript library that allows you to add a
* realtime data source to your React apps by providing and easy way to let
* Firebase populate the state of React components.
*
* ReactFire 0.0.0
* https://github.com/firebase/reactfire/
* License: MIT
*/
var ReactFireMixin = (function() {
"use strict";

0
changelog.txt Normal file
View File

142
dist/reactfire.js vendored
View File

@@ -1,142 +0,0 @@
// ReactFire is an officially supported ReactJS mixin for Firebase. Firebase
// provides your React app with a persistent, realtime backend to effortlessly
// keep all of your clients in sync!
//
// ReactFire 0.1.6
// https://github.com/firebase/reactfire/
// License: MIT
var ReactFireMixin = (function() {
"use strict";
var ReactFireMixin = {
/********************/
/* MIXIN LIFETIME */
/********************/
/* Initializes the Firebase binding refs array */
componentWillMount: function() {
this.firebaseRefs = {};
},
/* Removes any remaining Firebase bindings */
componentWillUnmount: function() {
for (var key in this.firebaseRefs) {
if (this.firebaseRefs.hasOwnProperty(key)) {
this.unbind(key);
}
}
},
/*************/
/* BINDING */
/*************/
/* Creates a binding between Firebase and the inputted bind variable as an array */
bindAsArray: function(firebaseRef, bindVar) {
this._bind(firebaseRef, bindVar, true);
},
/* Creates a binding between Firebase and the inputted bind variable as an object */
bindAsObject: function(firebaseRef, bindVar) {
this._bind(firebaseRef, bindVar, false);
},
/* Creates a binding between Firebase and the inputted bind variable as either an array or object */
_bind: function(firebaseRef, bindVar, bindAsArray) {
this._validateBindVar(bindVar);
var error;
if (typeof firebaseRef.ref === "undefined" || firebaseRef.ref() instanceof Firebase === false) {
error = "firebaseRef must be an instance of Firebase";
}
else if (typeof bindAsArray !== "boolean") {
error = "bindAsArray must be a boolean. Got: " + bindAsArray;
}
if (typeof error !== "undefined") {
throw new Error("ReactFire: " + error);
}
this.firebaseRefs[bindVar] = firebaseRef.ref();
firebaseRef.on("value", function(dataSnapshot) {
var newState = {};
if (bindAsArray) {
newState[bindVar] = this._toArray(dataSnapshot.val());
}
else {
newState[bindVar] = dataSnapshot.val();
}
this.setState(newState);
}.bind(this));
},
/* Removes the binding between Firebase and the inputted bind variable */
unbind: function(bindVar) {
this._validateBindVar(bindVar);
if (typeof this.firebaseRefs[bindVar] === "undefined") {
throw new Error("unexpected value for bindVar. \"" + bindVar + "\" was either never bound or has already been unbound");
}
this.firebaseRefs[bindVar].off("value");
delete this.firebaseRefs[bindVar];
},
/*************/
/* HELPERS */
/*************/
/* Validates the name of the variable which is being bound */
_validateBindVar: function(bindVar) {
var error;
if (typeof bindVar !== "string") {
error = "bindVar must be a string. Got: " + bindVar;
}
else if (bindVar.length === 0) {
error = "bindVar must be a non-empty string. Got: \"\"";
}
else if (bindVar.length > 768) {
// Firebase can only stored child paths up to 768 characters
error = "bindVar is too long to be stored in Firebase. Got: " + bindVar;
}
else if (/[\[\].#$\/\u0000-\u001F\u007F]/.test(bindVar)) {
// Firebase does not allow node keys to contain the following characters
error = "bindVar cannot contain any of the following characters: . # $ ] [ /. Got: " + bindVar;
}
if (typeof error !== "undefined") {
throw new Error("ReactFire: " + error);
}
},
/* Returns true if the inputted object is a JavaScript array */
_isArray: function(obj) {
return (Object.prototype.toString.call(obj) === "[object Array]");
},
/* Converts a Firebase object to a JavaScript array */
_toArray: function(obj) {
var out = [];
if (obj) {
if (this._isArray(obj)) {
out = obj;
}
else if (typeof(obj) === "object") {
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
out.push(obj[key]);
}
}
}
}
return out;
}
};
return ReactFireMixin;
})();
// Export ReactFireMixin if this is being run in node
if (typeof module !== "undefined" && typeof process !== "undefined") {
module.exports = ReactFireMixin;
}

1
dist/reactfire.min.js vendored
View File

@@ -1 +0,0 @@
var ReactFireMixin=function(){"use strict";var e={componentWillMount:function(){this.firebaseRefs={}},componentWillUnmount:function(){for(var e in this.firebaseRefs)this.firebaseRefs.hasOwnProperty(e)&&this.unbind(e)},bindAsArray:function(e,n){this._bind(e,n,!0)},bindAsObject:function(e,n){this._bind(e,n,!1)},_bind:function(e,n,t){this._validateBindVar(n);var i;if("undefined"==typeof e.ref||e.ref()instanceof Firebase==!1?i="firebaseRef must be an instance of Firebase":"boolean"!=typeof t&&(i="bindAsArray must be a boolean. Got: "+t),"undefined"!=typeof i)throw new Error("ReactFire: "+i);this.firebaseRefs[n]=e.ref(),e.on("value",function(e){var i={};i[n]=t?this._toArray(e.val()):e.val(),this.setState(i)}.bind(this))},unbind:function(e){if(this._validateBindVar(e),"undefined"==typeof this.firebaseRefs[e])throw new Error('unexpected value for bindVar. "'+e+'" was either never bound or has already been unbound');this.firebaseRefs[e].off("value"),delete this.firebaseRefs[e]},_validateBindVar:function(e){var n;if("string"!=typeof e?n="bindVar must be a string. Got: "+e:0===e.length?n='bindVar must be a non-empty string. Got: ""':e.length>768?n="bindVar is too long to be stored in Firebase. Got: "+e:/[\[\].#$\/\u0000-\u001F\u007F]/.test(e)&&(n="bindVar cannot contain any of the following characters: . # $ ] [ /. Got: "+e),"undefined"!=typeof n)throw new Error("ReactFire: "+n)},_isArray:function(e){return"[object Array]"===Object.prototype.toString.call(e)},_toArray:function(e){var n=[];if(e)if(this._isArray(e))n=e;else if("object"==typeof e)for(var t in e)e.hasOwnProperty(t)&&n.push(e[t]);return n}};return e}();"undefined"!=typeof module&&"undefined"!=typeof process&&(module.exports=ReactFireMixin);

4
examples/todoApp/firebase.json Normal file
View File

@@ -0,0 +1,4 @@
{
"firebase": "reactfiretodoapp",
"public": "."
}

7
gulpfile.js
View File

@@ -71,7 +71,9 @@ gulp.task("scripts", function() {
.pipe(gulp.dest(paths.scripts.dest.dir))
// Minify
.pipe(uglify())
.pipe(uglify({
preserveComments: "some"
}))
// Rename file
.pipe(concat(paths.scripts.dest.files.minified))
@@ -97,5 +99,8 @@ gulp.task("watch", function() {
gulp.watch(["build/*", paths.scripts.src.dir + "/**/*"], ["scripts"]);
});
/* Builds the distribution files */
gulp.task("build", ["scripts"]);
/* Runs the "test" and "scripts" tasks by default */
gulp.task("default", ["test", "scripts"]);

6
package.json
View File

@@ -1,7 +1,7 @@
{
"name": "reactfire",
"description": "Firebase mixin for ReactJS",
"version": "0.1.6",
"version": "0.0.0",
"author": "Firebase <support@firebase.com> (https://www.firebase.com/)",
"homepage": "https://github.com/firebase/reactfire/",
"repository": {
@@ -28,7 +28,6 @@
"dist/**",
"LICENSE",
"README.md",
"CHANGELOG.md",
"package.json"
],
"dependencies": {
@@ -51,6 +50,7 @@
"jshint-stylish": "^0.2.0"
},
"scripts": {
"test": "gulp test"
"test": "gulp test",
"travis": "gulp"
}
}

226
release.sh
View File

@@ -1,226 +0,0 @@
#!/bin/bash
STANDALONE_DEST="../firebase-clients/libs/reactfire"
STANDALONE_STUB="reactfire"
#############################
# VALIDATE reactfire REPO #
#############################
# Ensure the checked out reactfire branch is master
CHECKED_OUT_BRANCH="$(git branch | grep "*" | awk -F ' ' '{print $2}')"
if [[ $CHECKED_OUT_BRANCH != "master" ]]; then
echo "Error: Your reactfire repo is not on the master branch."
exit 1
fi
# Make sure the reactfire branch does not have existing changes
if ! git --git-dir=".git" diff --quiet; then
echo "Error: Your reactfire repo has existing changes on the master branch. Make sure you commit and push the new version before running this release script."
exit 1
fi
####################################
# VALIDATE firebase-clients REPO #
####################################
# Ensure the firebase-clients repo is at the correct relative path
if [[ ! -d $STANDALONE_DEST ]]; then
echo "Error: The firebase-clients repo needs to be a sibling of this repo."
exit 1
fi
# Go to the firebase-clients repo
cd ../firebase-clients
# Make sure the checked-out firebase-clients branch is master
FIREBASE_CLIENTS_BRANCH="$(git branch | grep "*" | awk -F ' ' '{print $2}')"
if [[ $FIREBASE_CLIENTS_BRANCH != "master" ]]; then
echo "Error: Your firebase-clients repo is not on the master branch."
exit 1
fi
# Make sure the firebase-clients branch does not have existing changes
if ! git --git-dir=".git" diff --quiet; then
echo "Error: Your firebase-clients repo has existing changes on the master branch."
exit 1
fi
# Go back to starting directory
cd -
##############################
# VALIDATE CLIENT VERSIONS #
##############################
# Get the version we are releasing
PARSED_CLIENT_VERSION=$(head -5 dist/reactfire.js | tail -1 | awk -F ' ' '{print $3}')
# Ensure this is the correct version number
read -p "What version are we releasing? ($PARSED_CLIENT_VERSION) " VERSION
if [[ -z $VERSION ]]; then
VERSION=$PARSED_CLIENT_VERSION
fi
echo
# Ensure the changelog has been updated for the newest version
CHANGELOG_VERSION="$(head -1 CHANGELOG.md | awk -F 'v' '{print $2}')"
if [[ $VERSION != $CHANGELOG_VERSION ]]; then
echo "Error: Most recent version in changelog (${CHANGELOG_VERSION}) does not match version you are releasing (${VERSION})."
exit 1
fi
# Ensure the README has been updated for the newest version
README_VERSION="$(grep '<script src=\"https://cdn.firebase.com/libs/reactfire/' README.md | awk -F '/' '{print $6}')"
if [[ $VERSION != $README_VERSION ]]; then
echo "Error: Script tag version in README (${README_VERSION}) does not match version you are releasing (${VERSION})."
exit 1
fi
# Ensure the version number in the package.json is correct
NPM_VERSION=$(grep "version" package.json | head -1 | awk -F '"' '{print $4}')
if [[ $VERSION != $NPM_VERSION ]]; then
echo "Error: npm version specified in package.json (${NPM_VERSION}) does not match version you are releasing (${VERSION})."
exit 1
fi
# Ensure the version number in the bower.json is correct
BOWER_VERSION=$(grep "version" bower.json | head -1 | awk -F '"' '{print $4}')
if [[ $VERSION != $BOWER_VERSION ]]; then
echo "Error: Bower version specified in bower.json (${BOWER_VERSION}) does not match version you are releasing (${VERSION})."
exit 1
fi
# Ensure there is not an existing git tag for the new version
LAST_GIT_TAG="$(git tag --list | tail -1 | awk -F 'v' '{print $2}')"
if [[ $VERSION == $LAST_GIT_TAG ]]; then
echo "Error: git tag v${VERSION} already exists. Make sure you are not releasing an already-released version."
exit 1
fi
# Ensure that we don't already have this as a standalone
STANDALONE_TARGET_DIR="${STANDALONE_DEST}/${VERSION}/"
if [[ -e ${STANDALONE_TARGET_DIR} ]]; then
echo "Error: The target directory already exists: ${STANDALONE_TARGET_DIR}."
exit 1
fi
######################
# PUBLISH TO Bower #
######################
# Pull any changes to the reactfire repo
git pull origin master
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git pull' from reactfire repo."
exit 1
fi
# Create a git tag for the new version
git tag v$VERSION
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git tag' from reactfire repo."
exit 1
fi
# Push the new git tag
git push --tags
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git push --tags' from reactfire repo."
exit 1
fi
echo "*** Last commit tagged as v${VERSION} ***"
echo
# Changing the git tag publishes the new version to Bower automatically
echo "*** v${VERSION} published to Bower ***"
echo
####################
# PUBLISH TO npm #
####################
# Publish the new version to npm
npm publish
if [[ $? -ne 0 ]]; then
echo "!!! Error publishing to npm! You must do this manually by running 'npm publish'. !!!"
exit 1
fi
echo "*** v${VERSION} of reactfire published to npm ***"
echo
#############################
# UPDATE firebase-clients #
#############################
# Make the target directory
mkdir $STANDALONE_TARGET_DIR
if [[ $? -ne 0 ]]; then
echo "Error: Failed to create standalone target directory in firebase-clients repo."
exit 1
fi
# Copy the files to the target directory
cp dist/$STANDALONE_STUB.js $STANDALONE_TARGET_DIR
cp dist/$STANDALONE_STUB.min.js $STANDALONE_TARGET_DIR
echo "*** Client (debug and non-debug) files copied ***"
echo
# Overwrite the existing changelog
cp CHANGELOG.md $STANDALONE_DEST/changelog.txt
echo "*** Changelog copied ***"
echo
# Go to the firebase-clients repo
cd ${STANDALONE_DEST}/
# Pull any changes to the firebase-clients repo
git pull origin master
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git pull' from firebase-clients repo."
exit 1
fi
# Add the new files to the firebase-clients repo
git add .
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git add' from firebase-clients repo."
exit 1
fi
# Commit to the firebase-clients repo
git commit -am "[firebase-release] Updated ReactFire to $VERSION"
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git commit' from firebase-clients repo."
exit 1
fi
# Push the new files to the firebase-clients repo
git push origin master
if [[ $? -ne 0 ]]; then
echo "Error: Failed to do 'git push' to firebase-clients repo."
exit 1
fi
echo
echo "*** Changes pushed to firebase-clients repo ***"
echo
# Go back to starting directory
cd -
##################
# MANUAL TASKS #
##################
echo
echo "Manual steps remaining:"
echo " 1) Deploy firebase-clients to CDN via Jenkins"
echo " 2) Update the release notes for ReactFire version ${VERSION} on GitHub"
echo " 3) Update all ReactFire client version numbers specified in firebase-website to ${VERSION}"
echo " 4) Tweet @FirebaseRelease: 'v${VERSION} of ReactFire is available https://cdn.firebase.com/libs/reactfire/$VERSION/reactfire.min.js Changelog: https://cdn.firebase.com/libs/reactfire/changelog.txt'"
echo
echo "Done! Woot!"
echo