diff --git a/README.md b/README.md index 000f33b..445dbac 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ The ReactFireMixin can be added to you project in two ways: * Manually copy ReactFireMixin.js from GitHub to you local directory. * Use bower: `bower install ReactFire` -To use the ReactFireMixin in a React component, update the component's mixins property: +To use the ReactFireMixin in a React component, add it to the component's mixins property: var ExampleComponent = React.createClass({ mixins: [ReactFireMixin], diff --git a/examples/README.md b/examples/README.md new file mode 100644 index 0000000..426f9f6 --- /dev/null +++ b/examples/README.md @@ -0,0 +1,8 @@ +ReactFire Examples +================== + +Have you come up with a cool example that uses the ReactFireMixin? Submit a pull request and share +it with everyone else by putting in this /examples/ directory. Please make sure to include a README.md +file in your examples base directory which explains what the example is and how to run it. + +Check out the [todoApp example](./todoApp/) to see how to structure your examples. \ No newline at end of file diff --git a/examples/todoApp/README.md b/examples/todoApp/README.md new file mode 100644 index 0000000..2e49b93 --- /dev/null +++ b/examples/todoApp/README.md @@ -0,0 +1,42 @@ +ReactFire Todo App Example +========================== + +Live Demo +--------- +You can view a live version of this demo [here](https://reactfiretodoapp.firebaseapp.com/). + +Setup Instructions +-------------------- +To run this example locally, either download the whole ReactFire repo or just this /todoApp/ +directory. From the /todoApp/ directory, install the needed dependencies via bower: + +```bash +$ bower install +``` + +Then start up a server via Python (or your favorite method): + +```bash +$ python -m SimpleHTTPServer 8080 +``` + +Now you should be able to visit the example in the browser of your choice at [http://127.0.0.1:8080/](http://127.0.0.1:8080/). + +Description +----------- +This example shows three different ways to make a Todo app using React. It is adapted from the +Todo app example on the [ReactJS homepage](http://facebook.github.io/react/). There are three +different versions of the Todo app example: + +1. __Plain React:__ Almost an exact copy of the ReactJS homepage example. This uses plain React +code with no Firebase code at all. Changes made to this example are not persistent. + +2. __React + Plain Firebase:__ A version of the first example with explicit Firebase calls. Changes +made to this example are persistent. + +3. __ReactFireMixin:__ A version of the first example which uses the ReactFireMixin. Changes made to +this example are persistent. + +Walkthrough +----------- +To learn more about how this example works, see the [blog post on the official Firebase blog](https://www.firebase.com/blog/2014-05-01-using-firebase-with-react.html). \ No newline at end of file