{"id":14974270,"url":"https://github.com/fullstackreact/react-native-firestack","last_synced_at":"2025-04-08T12:10:54.048Z","repository":{"id":57337018,"uuid":"60655868","full_name":"fullstackreact/react-native-firestack","owner":"fullstackreact","description":"A firestack v3 react-native implementation","archived":false,"fork":false,"pushed_at":"2023-01-23T18:31:43.000Z","size":48932,"stargazers_count":714,"open_issues_count":112,"forks_count":131,"subscribers_count":22,"default_branch":"master","last_synced_at":"2025-04-01T11:02:20.986Z","etag":null,"topics":["firebase","react-native","react-native-app","react-native-firebase"],"latest_commit_sha":null,"homepage":null,"language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fullstackreact.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"Contributing.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-06-08T00:25:17.000Z","updated_at":"2025-02-27T15:31:02.000Z","dependencies_parsed_at":"2023-02-13T02:01:54.608Z","dependency_job_id":null,"html_url":"https://github.com/fullstackreact/react-native-firestack","commit_stats":null,"previous_names":[],"tags_count":28,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fullstackreact%2Freact-native-firestack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fullstackreact%2Freact-native-firestack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fullstackreact%2Freact-native-firestack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fullstackreact%2Freact-native-firestack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fullstackreact","download_url":"https://codeload.github.com/fullstackreact/react-native-firestack/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247838445,"owners_count":21004580,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["firebase","react-native","react-native-app","react-native-firebase"],"created_at":"2024-09-24T13:50:18.973Z","updated_at":"2025-04-08T12:10:53.998Z","avatar_url":"https://github.com/fullstackreact.png","language":"Java","readme":"----\n### This library is no longer maintained, use at your own risk or please [seek alternatives on npm](https://www.npmjs.com/search?q=react+native+firebase).\n----\n\n## Firestack\n\nFirestack makes using the latest [Firebase](https://firebase.google.com/) straight-forward.\n\n[![Gitter](https://badges.gitter.im/fullstackreact/react-native-firestack.svg)](https://gitter.im/fullstackreact/react-native-firestack?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge)\n\n## What\n\nFirestack is a _light-weight_ layer sitting atop the native Firebase libraries for iOS and Android and mirrors the React Native JS api as closely as possible.\n\nFor a detailed discussion of how Firestack works as well as how to contribute, check out our [contribution guide](https://github.com/fullstackreact/react-native-firestack/blob/master/Contributing.md).\n\n## Features\n\n* Nearly automatic, rapid setup on Firebase\n* Covers lots of awesome features of Firebase:\n  * authentication\n    * username and password\n    * social auth (implemented in conjunction with [react-native-oauth](https://github.com/fullstackreact/react-native-oauth))\n      * Facebook\n      * Github\n      * Google\n      * Twitter\n  * storage handling\n    * upload files\n    * download urls\n    * download files\n  * real-time database\n  * presence out-of-the-box\n  * analytics\n  * Remote configuration\n  * FCM (in-progress)\n* Redux support built-in (but not required)\n* Android and iOS support\n* Community supported and professionally backed\n* Intended on being as drop-dead simple as possible\n* And so much more\n\n## Example app\n\nWe have a working application example available in at [fullstackreact/FirestackApp](https://github.com/fullstackreact/FirestackApp). Check it out for more details about how to use Firestack.\n\n## Why?\n\nFirebase is awesome and it's combination with the Google Cloud Platform makes it super awesome. Sadly, the latest version of Firebase requires the `window` object. That's where Firestack comes in! Firestack provides a really thin layer that sits on top of the native Firebase SDKs and attempts to use the JavaScript library as much as possible rather than reinventing the wheel.\n\n## Installing\n\nGetting `react-native-firestack` up and running in your app should be a 2 step process + 1 for each platform.\n\n1. Install the `npm` package\n2. Link the project with `react-native link react-native-firestack`\n3. To ensure Android is setup, check your `MainApplication.java` for the `FirestackPackage()` line.\n\nThose steps in more detail:\n\nInstall the `npm` package with:\n\n```bash\nnpm install react-native-firestack --save\n```\n\nTo use Firestack, we'll need to have a development environment that includes the same prerequisites of Firebase.\n\n### iOS (with cocoapods)\n\nUnfortunately, due to AppStore restrictions, we currently do _not_ package Firebase libraries in with Firestack. However, the good news is we've automated the process (with many thanks to the Auth0 team for inspiration) of setting up with cocoapods. This will happen automatically upon linking the package with `react-native-cli`.\n\n**Remember to use the `ios/[YOUR APP NAME].xcworkspace` instead of the `ios/[YOUR APP NAME].xcproj` file from now on**.\n\nWe need to link the package with our development packaging. We have two options to handle linking:\n\n#### Automatically with react-native-cli\n\nReact native ships with a `link` command that can be used to link the projects together, which can help automate the process of linking our package environments.\n\n```bash\nreact-native link react-native-firestack\n```\n\nUpdate the newly installed pods once the linking is done:\n\n```bash\ncd ios \u0026\u0026 pod update --verbose\n```\n\n#### Manually\n\nIf you prefer not to use `rnpm`, we can manually link the package together with the following steps, after `npm install`:\n\n1. In XCode, right click on `Libraries` and find the `Add Files to [project name]`.\n\n![Add library to project](http://d.pr/i/2gEH.png)\n\n2. Add the `node_modules/react-native-firestack/ios/Firestack.xcodeproj`\n\n![Firebase.xcodeproj in Libraries listing](http://d.pr/i/19ktP.png)\n\n3. Ensure that the `Build Settings` of the `Firestack.xcodeproj` project is ticked to _All_ and it's `Header Search Paths` include both of the following paths _and_ are set to _recursive_:\n\n  1. `$(SRCROOT)/../../react-native/React`\n  2. `$(SRCROOT)/../node_modules/react-native/React`\n  3. `${PROJECT_DIR}/../../../ios/Pods`\n\n![Recursive paths](http://d.pr/i/1hAr1.png)\n\n4. Setting up cocoapods\n\nSince we're dependent upon cocoapods (or at least the Firebase libraries being available at the root project -- i.e. your application), we have to make them available for Firestack to find them.\n\nUsing cocoapods is the easiest way to get started with this linking. Add or update a `Podfile` at `ios/Podfile` in your app with the following:\n\n```ruby\nsource 'https://github.com/CocoaPods/Specs.git'\n[\n  'Firebase/Core',\n  'Firebase/Auth',\n  'Firebase/Storage',\n  'Firebase/Database',\n  'Firebase/RemoteConfig',\n  'Firebase/Messaging'\n].each do |lib|\n  pod lib\nend\n\ntarget '[project name]' do\nend\n\n# target '[project test name]' do\n# end\n```\n\nThen you can run `(cd ios \u0026\u0026 pod install)` to get the pods opened. If you do use this route, remember to use the `.xcworkspace` file.\n\nIf you don't want to use cocoapods, you don't need to use it! Just make sure you link the Firebase libraries in your project manually. For more information, check out the relevant Firebase docs at [https://firebase.google.com/docs/ios/setup#frameworks](https://firebase.google.com/docs/ios/setup#frameworks).\n\n### Android\n\nFull Android support is coming soon, as it currently supports a smaller feature-set than the iOS version. Just as we do with iOS, we'll need to install the library using `npm` and call `link` on the library:\n\n```bash\nreact-native link react-native-firestack\n```\n\nFirestack includes the Firebase libraries and will link those directly into our project automatically.\n\n#### Manually\n\nTo install `react-native-firestack` manually in our project, we'll need to import the package from `io.fullstack.firestack` in our project's `android/app/src/main/java/com/[app name]/MainApplication.java` and list it as a package for ReactNative in the `getPackages()` function:\n\n```java\npackage com.appName;\n// ...\nimport io.fullstack.firestack.FirestackPackage;\n// ...\npublic class MainApplication extends Application implements ReactApplication {\n    // ...\n\n    @Override\n    protected List\u003cReactPackage\u003e getPackages() {\n      return Arrays.\u003cReactPackage\u003easList(\n          new MainReactPackage(),\n            new FirestackPackage()\n      );\n    }\n  };\n  // ...\n}\n```\n\nWe'll also need to list it in our `android/app/build.gradle` file as a dependency that we want React Native to compile. In the `dependencies` listing, add the `compile` line:\n\n```java\ndependencies {\n  compile project(':react-native-firestack')\n}\n```\n\nAdd to `AndroidManifest.xml` file\n```diff\n  \u003cactivity android:name=\"com.facebook.react.devsupport.DevSettingsActivity\" /\u003e\n+   \u003cservice android:name=\"io.fullstack.firestack.FirestackMessagingService\"\u003e\n+     \u003cintent-filter\u003e\n+       \u003caction android:name=\"com.google.firebase.MESSAGING_EVENT\"/\u003e\n+     \u003c/intent-filter\u003e\n+   \u003c/service\u003e\n\n+   \u003cservice android:name=\"io.fullstack.firestack.FirestackInstanceIdService\" android:exported=\"false\"\u003e\n+     \u003cintent-filter\u003e\n+       \u003caction android:name=\"com.google.firebase.INSTANCE_ID_EVENT\"/\u003e\n+     \u003c/intent-filter\u003e\n+   \u003c/service\u003e\n```\n\n## Firebase setup\n\nThe Firestack library is intended on making it easy to work with [Firebase](https://firebase.google.com/) and provides a small native shim to the Firebase native code.\n\nTo add Firebase to your project, make sure to create a project in the [Firebase console](https://firebase.google.com/console)\n\n![Create a new project](http://d.pr/i/17cJ2.png)\n\nEach platform uses a different setup method after creating the project.\n\n### iOS\n\nAfter creating a Firebase project, click on the [Add Firebase to your iOS app](http://d.pr/i/3sEL.png) and follow the steps from there to add the configuration file. You do _not_ need to set up a cocoapods project (this is already done through firestack). Make sure not to forget the `Copy Files` phase in iOS.\n\n[Download the Firebase config file](https://support.google.com/firebase/answer/7015592) and place it in your app directory next to your app source code:\n\n![GoogleService-Info.plist](http://d.pr/i/1eGev.png)\n\nOnce you download the configuration file, make sure you place it in the root of your Xcode project. Every different Bundle ID (aka, even different project variants needs their own configuration file).\n\nLastly, due to some dependencies requirements, Firestack supports iOS versions 8.0 and up. Make sure to update the minimum version of your iOS app to `8.0`.\n\n### Android\n\nThere are several ways to setup Firebase on Android. The _easiest_ way is to pass the configuration settings in JavaScript. In that way, there is no setup for the native platform.\n\n#### google-services.json setup\nIf you prefer to include the default settings in the source of your app, download the `google-services.json` file provided by Firebase in the _Add Firebase to Android_ platform menu in your Firebase configuration console.\n\nNext you'll have to add the google-services gradle plugin in order to parse it.\n\nAdd the google-services gradle plugin as a dependency in the *project* level build.gradle\n`android/build.gradle`\n```java\nbuildscript {\n  // ...\n  dependencies {\n    // ...\n    classpath 'com.google.gms:google-services:3.0.0'\n  }\n}\n```\n\nIn your app build.gradle file, add the gradle plugin at the VERY BOTTOM of the file (below all dependencies)\n`android/app/build.gradle`\n```java\napply plugin: 'com.google.gms.google-services'\n```\n\n## Usage\n\nAfter creating a Firebase project and installing the library, we can use it in our project by importing the library in our JavaScript:\n\n```javascript\nimport Firestack from 'react-native-firestack'\n```\n\nWe need to tell the Firebase library we want to _configure_ the project. Firestack provides a way to configure both the native and the JavaScript side of the project at the same time with a single command:\n\n```javascript\nconst firestack = new Firestack();\n```\n\nWe can pass _custom_ options by passing an object with configuration options. The configuration object will be generated first by the native configuration object, if set and then will be overridden if passed in JS. That is, all of the following key/value pairs are optional if the native configuration is set.\n\n| option           | type | Default Value           | Description                                                                                                                                                                                                                                                                                                                                                      |\n|----------------|----------|-------------------------|----------------------------------------|\n| debug | bool | false | When set to true, Firestack will log messages to the console and fire `debug` events we can listen to in `js` |\n| bundleID | string | Default from app `[NSBundle mainBundle]` | The bundle ID for the app to be bundled with |\n| googleAppID | string | \"\" | The Google App ID that is used to uniquely identify an instance of an app. |\n| databaseURL | string | \"\" | The database root (i.e. https://my-app.firebaseio.com) |\n| deepLinkURLScheme | string | \"\" | URL scheme to set up durable deep link service |\n| storageBucket | string | \"\" | The Google Cloud storage bucket name |\n| androidClientID | string | \"\" | The Android client ID used in Google AppInvite when an iOS app has it's android version |\n| GCMSenderID | string | \"\" | The Project number from the Google Developer's console used to configure Google Cloud Messaging |\n| trackingID | string | \"\" | The tracking ID for Google Analytics |\n| clientID | string | \"\" | The OAuth2 client ID for iOS application used to authenticate Google Users for signing in with Google |\n| APIKey | string | \"\" | The secret iOS API key used for authenticating requests from our app |\n\nFor instance:\n\n```javascript\nconst configurationOptions = {\n  debug: true\n};\nconst firestack = new Firestack(configurationOptions);\nfirestack.on('debug', msg =\u003e console.log('Received debug message', msg))\n```\n\n## API documentation\n\nFirestack is broken up into multiple parts, based upon the different API features that Firebase provides.\n\nAll methods return a promise.\n\n### Authentication\n\nFirestack handles authentication for us out of the box, both with email/password-based authentication and through oauth providers (with a separate library to handle oauth providers).\n\n\u003e Android requires the Google Play services to installed for authentication to function.\n\n#### listenForAuth()\n\nFirebase gives us a reactive method for listening for authentication. That is we can set up a listener to call a method when the user logs in and out. To set up the listener, call the `listenForAuth()` method:\n\n```javascript\nfirestack.auth.listenForAuth(function(evt) {\n  // evt is the authentication event\n  // it contains an `error` key for carrying the\n  // error message in case of an error\n  // and a `user` key upon successful authentication\n  if (!evt.authenticated) {\n    // There was an error or there is no user\n    console.error(evt.error)\n  } else {\n    // evt.user contains the user details\n    console.log('User details', evt.user);\n  }\n})\n.then(() =\u003e console.log('Listening for authentication changes'))\n```\n\n#### unlistenForAuth()\n\nWe can remove this listener by calling the `unlistenForAuth()` method. This is important to release resources from our app when we don't need to hold on to the listener any longer.\n\n```javascript\nfirestack.auth.unlistenForAuth()\n```\n\n#### createUserWithEmail()\n\nWe can create a user by calling the `createUserWithEmail()` function. The `createUserWithEmail()` accepts two parameters, an email and a password.\n\n```javascript\nfirestack.auth.createUserWithEmail('ari@fullstack.io', '123456')\n  .then((user) =\u003e {\n    console.log('user created', user)\n  })\n  .catch((err) =\u003e {\n    console.error('An error occurred', err);\n  })\n```\n\n#### signInWithEmail()\n\nTo sign a user in with their email and password, use the `signInWithEmail()` function. It accepts two parameters, the user's email and password:\n\n```javascript\nfirestack.auth.signInWithEmail('ari@fullstack.io', '123456')\n  .then((user) =\u003e {\n    console.log('User successfully logged in', user)\n  })\n  .catch((err) =\u003e {\n    console.error('User signin error', err);\n  })\n```\n\n#### signInWithCustomToken()\n\nTo sign a user using a self-signed custom token, use the `signInWithCustomToken()` function. It accepts one parameter, the custom token:\n\n```javascript\nfirestack.auth.signInWithCustomToken(TOKEN)\n  .then((user) =\u003e {\n    console.log('User successfully logged in', user)\n  })\n  .catch((err) =\u003e {\n    console.error('User signin error', err);\n  })\n```\n\n#### signInWithProvider()\n\nWe can use an external authentication provider, such as twitter/facebook for authentication. In order to use an external provider, we need to include another library to handle authentication.\n\n\u003e By using a separate library, we can keep our dependencies a little lower and the size of the application down.\n\n### OAuth setup with library\n\n[Currently undergoing updates]\n\n### socialLogin with custom Library\nIf you don't want to use [react-native-oauth](https://github.com/fullstackreact/react-native-oauth), you can use other library such as [react-native-facebook-login](https://github.com/magus/react-native-facebook-login).\n\n```javascript\nvar {FBLogin, FBLoginManager} = require('react-native-facebook-login');\n\nvar Login = React.createClass({\n  render: function() {\n    return (\n      \u003cFBLogin\n        onLogin={function(data){\n          console.log(\"Logged in!\");\n          console.log(data);\n          let token = data.credentials.token\n          firestack.auth.signInWithProvider('facebook', token, '') // facebook need only access token.\n            .then((user)=\u003e{\n              console.log(user)\n            })\n        }}\n      /\u003e\n    );\n  }\n});\n```\n\nIf the `signInWithProvider()` method resolves correct and we have already set up our `listenForAuth()` method properly, it will fire and we'll have a logged in user through Firebase.\n\n### reauthenticateWithCredentialForProvider()\n\nWhen the auth token has expired, we can ask firebase to reauthenticate with the provider. This method accepts the _same_ arguments as `signInWithProvider()` accepts.\n\n#### updateUserEmail()\n\nWe can update the current user's email by using the command: `updateUserEmail()`. It accepts a single argument: the user's new email:\n\n```javascript\nfirestack.auth.updateUserEmail('ari+rocks@fullstack.io')\n  .then((res) =\u003e console.log('Updated user email'))\n  .catch(err =\u003e console.error('There was an error updating user email'))\n```\n\n#### updateUserPassword()\n\nWe can update the current user's password using the `updateUserPassword()` method. It accepts a single parameter: the new password for the current user\n\n```javascript\nfirestack.auth.updateUserPassword('somethingReallyS3cr3t733t')\n  .then(res =\u003e console.log('Updated user password'))\n  .catch(err =\u003e console.error('There was an error updating your password'))\n```\n\n### sendPasswordResetWithEmail()\n\nTo send a password reset for a user based upon their email, we can call the `sendPasswordResetWithEmail()` method. It accepts a single parameter: the email of the user to send a reset email.\n\n```javascript\nfirestack.auth.sendPasswordResetWithEmail('ari+rocks@fullstack.io')\n  .then(res =\u003e console.log('Check your inbox for further instructions'))\n  .catch(err =\u003e console.error('There was an error :('))\n```\n\n#### updateUserProfile()\n\nTo update the current user's profile, we can call the `updateUserProfile()` method.\n\nIt accepts a single parameter:\n\n* object which contains updated key/values for the user's profile. Possible keys are listed [here](https://firebase.google.com/docs/auth/ios/manage-users#update_a_users_profile).\n\n```javascript\nfirestack.auth.updateUserProfile({\n  displayName: 'Ari Lerner'\n})\n  .then(res =\u003e console.log('Your profile has been updated'))\n  .catch(err =\u003e console.error('There was an error :('))\n```\n\n#### deleteUser()\n\nIt's possible to delete a user completely from your account on Firebase. Calling the `deleteUser()` method will take care of this for you.\n\n```javascript\nfirestack.auth.deleteUser()\n.then(res =\u003e console.log('Sad to see you go'))\n.catch(err =\u003e console.error('There was an error - Now you are trapped!'))\n```\n\n#### getToken()\n\nIf you want user's token, use `getToken()` method.\n\n```javascript\nfirestack.auth.getToken()\n.then(res =\u003e console.log(res.token))\n.catch(err =\u003e console.error('error'))\n```\n\n#### signOut()\n\nTo sign the current user out, use the `signOut()` method. It accepts no parameters\n\n```javascript\nfirestack.auth.signOut()\n.then(res =\u003e console.log('You have been signed out'))\n.catch(err =\u003e console.error('Uh oh... something weird happened'))\n```\n\n#### getCurrentUser()\n\nAlthough you _can_ get the current user using the `getCurrentUser()` method, it's better to use this from within the callback function provided by `listenForAuth()`. However, if you need to get the current user, call the `getCurrentUser()` method:\n\n```javascript\nfirestack.auth.getCurrentUser()\n.then(user =\u003e console.log('The currently logged in user', user))\n.catch(err =\u003e console.error('An error occurred'))\n```\n\n### Analytics\n\nWouldn't it be nice to send analytics about your app usage from your users? Well, you totally can! The Firebase analytics console is incredibly useful and Firestack has a method for interacting with it. You can send any event with contextual information, which automatically includes the currently logged in user using the `logEventWithName()` method. It accepts two parameters: the name of the event and an object containing any contextual information. The values should be serializable (i.e. no complex instance objects).\n\n#### logEventWithName()\n\n```javascript\nfirestack.analytics.logEventWithName(\"launch\", {\n  'screen': 'Main screen'\n})\n.then(res =\u003e console.log('Sent event named launch'))\n.catch(err =\u003e console.error('You should never end up here'));\n```\n\n### Storage\n\nFirebase's integration with the Google platform expanded it's features to include hosting user-generated files, like photos. Firestack provides a thin layer to handle uploading files to Firebase's storage service.\n\n#### setStorageUrl()\n\nIn order to store anything on Firebase, we need to set the storage url provided by Firebase. This can be set by using the `setStorageUrl()` method. Your storageUrl can be found on the firebase console.\n\n![Storage url](http://d.pr/i/1lKjQ.png)\n\nThe `setStorageUrl()` method accepts a single parameter: your root storage url (without leading \"gs://\").\n\n```javascript\nfirestack.storage.setStorageUrl(`${config.firebase.storageBucket}`)\n```\n\nIf the `storageBucket` key is passed as a configuration option, this method is automatically called by default.\n\n#### uploadFile()\n\nWe can upload a file using the `uploadFile()` method. Using the `uploadFile()` method, we can set the name of the destination file, the path where we want to store it, as well as any metadata along with the file.\n\n```javascript\nfirestack.storage.uploadFile(`photos/${auth.user.uid}/${filename}`, path, {\n  contentType: 'image/jpeg',\n  contentEncoding: 'base64',\n})\n.then((res) =\u003e console.log('The file has been uploaded'))\n.catch(err =\u003e console.error('There was an error uploading the file', err))\n```\n\nTo upload camera photos, we can combine this method with the `react-native-camera` plugin, for instance:\n\n```javascript\nthis.camera.capture()\n.then(({path}) =\u003e {\n  firestack.storage.uploadFile(`photos/${auth.user.uid}/${filename}`, path, {\n    contentType: 'image/jpeg',\n    contentEncoding: 'base64',\n  })\n})\n.catch(err =\u003e console.error(err));\n```\n\nTo combine the `react-native-camera` plugin with firestack, we recommend setting the `captureTarget` to the `temp` storage path, like so:\n\n```javascript\n\u003cCamera\n  ref={(cam) =\u003e {\n    this.camera = cam;\n  }}\n  captureTarget={Camera.constants.CaptureTarget.temp}\n  style={styles.preview}\n  aspect={Camera.constants.Aspect.fill}\u003e\n    \u003cText style={styles.capture} onPress={this.takePicture.bind(this)}\u003e[CAPTURE]\u003c/Text\u003e\n\u003c/Camera\u003e\n```\n\nFirestack also gives you the ability to listen for database events on upload. The final parameter the `uploadFile()` function accepts is a callback that will be called anytime a storage event is fired.\n\nThe following events are supported:\n\n* upload_progress\n* upload_paused\n* upload_resumed\n\nFor example, the `takePicture` function from the example above might look something similar to:\n\n```javascript\ntakePicture() {\n  this.camera.capture()\n    .then(({path}) =\u003e {\n      const filename = 'photo.jpg'\n      firestack.storage.uploadFile(`photos/${filename}`, path, {\n        contentType: 'image/jpeg',\n        contentEncoding: 'base64',\n      }, (evt) =\u003e {\n        console.log('Got an event in JS', evt);\n      })\n      .then((res) =\u003e {\n        console.log('result from upload file: ', res);\n      })\n      .catch((err) =\u003e {\n        console.log('error happened with uploadFile', err);\n      })\n    })\n    .catch(err =\u003e console.error(err));\n}\n```\n\n#### downloadUrl()\n\nThe `downloadUrl()` method allows us to fetch the URL from the storage obejct in Firebase. It's defined on the `storageRef` object and can be used like so:\n\n```javascript\nconst storageRef = data.firestack.storage.ref('photos/photo.jpg');\nstorageRef.downloadUrl()\n.then(res =\u003e {\n  // res is an object that contains\n  // the `url` as well as the path to the file in `path`\n})\n```\n\n#### download()\n\nIt's possible to download remote files as well. The `download()` method will take a remote file and download and save it to the user's device. It is implemented on the `storageRef`:\n\n```javascript\nconst storageRef = data.firestack.storage.ref('photos/photo.jpg');\nconst localPath = `downloadedFile.jpg`;\nstorageRef.download(localPath, (msg) =\u003e {\n  // downloading state callback\n})\n.then(res =\u003e {\n  // res contains details about the downloaded file\n})\n.catch(err =\u003e {\n  // error contains any errors in downloading\n});\n```\n\nThe method accepts a callback that gets called with any download events:\n\n* download_progress ({eventName: 'download_progress', progress: float });\n* download_paused ({eventName: 'download_paused'})\n* download_resumed ({eventName: 'download_resumed'})\n\nAs helpful constants, Firestack exports a few storage constants on the `firestack.constants` getter:\n\n* MAIN_BUNDLE_PATH\n* CACHES_DIRECTORY_PATH\n* DOCUMENT_DIRECTORY_PATH\n* EXTERNAL_DIRECTORY_PATH\n* EXTERNAL_STORAGE_DIRECTORY_PATH\n* TEMP_DIRECTORY_PATH\n* LIBRARY_DIRECTORY_PATH\n\nAnd we also export the filetype constants as well:\n\n* FILETYPE_REGULAR\n* FILETYPE_DIRECTORY\n\n\u003e Note: this idea comes almost directory from [react-native-fs](https://github.com/johanneslumpe/react-native-fs), so we don't claim credit for coming up with this fantastic idea.\n\n### Realtime Database\n\nThe native Firebase JavaScript library provides a featureful realtime database that works out of the box. Firestack provides an attribute to interact with the database without needing to configure the JS library.\n\nRanking strategy\n\nAdd a new record with timestamp using this solution:\n\n```js\nfirebaseApp.database.ref('posts').push().then((res) =\u003e {\n let newPostKey = res.key;\n firebaseApp.ServerValue.then(map =\u003e {\n   const postData = {\n     name: name,\n     timestamp: map.TIMESTAMP,\n     text: this.state.postText,\n     title: this.state.postTitle,\n     puid: newPostKey\n    }\n    let updates = {}\n    updates['/posts/' + newPostKey] = postData\n    firebaseApp.database.ref().update(updates).then(() =\u003e {\n      this.setState({\n                      postStatus: 'Posted! Thank You.',\n                      postText: '',\n                    });\n    }).catch(() =\u003e {\n      this.setState({ postStatus: 'Something went wrong!!!' });\n    })\n  })\n})\n```\n\nThen retrieve the feed using this:\n\n```js\nfirebaseApp.database.ref('posts').orderByChild('timestamp').limitToLast(30).once('value')\n.then((snapshot) =\u003e {\n  this.props.savePosts(snapshot.val())\n  const val = snapshot.val();\n  console.log(val);\n})\n```\n\n#### DatabaseRef\n\nFirestack attempts to provide the same API as the JS Firebase library for both Android and iOS platforms. [Check out the firebase guide](https://firebase.google.com/docs/database/web/read-and-write) for more information on how to use the JS library.\n\n#### Example\n\n```javascript\n\nfunction handleValueChange(snapshot) {\n  if (snapshot.val()) {\n    console.log('The list was updated');\n  }\n}\n\nconst LIST_KEY = 'path/to/data';\nfirestack.database.ref(LIST_KEY).on('value', handleValueChange);\n\n// Calling `.off` with a reference to the callback function will only remove that specific listener.\n// This is useful if multiple components are listening and unlistening to the same ref path.\nfirestack.database.ref(LIST_KEY).off('value', handleValueChange);\n\n// Calling `.off` without passing the callback function will remove *all* 'value' listeners for that ref\nfirestack.database.ref(LIST_KEY).off('value');\n\n```\n\n// TODO: Finish documenting\n\n#### Offline data persistence\n\nFor handling offline operations, you can enable persistence by using the `setPersistence()` command. You can turn it on and off by passing the boolean of `true` or `false`.\n\n```javascript\nfirestack.database.setPersistence(true);\n```\n\nThe database refs has a `keepSynced()` function to tell the firestack library to keep the data at the `ref` in sync.\n\n```javascript\nconst ref = firestack.database\n            .ref('chat-messages')\n            .child('roomId');\nref.keepSynced(true);\n```\n\n### Presence\n\nFirestack comes in with a built-in method for handling user connections. We just need to set the presence ref url and tell Firestack to keep track of the user by their child path.\n\n```javascript\nfirestack.presence          // the presence api\n  .on('users/connections')  // set the users/connections as the\n                            // root for presence handling\n  .setOnline('auser')       // Set the child of auser as online\n```\n\nWhile the _device_ is online (the connection), the value of the child object at `users/connections/auser` will be:\n\n```javascript\n{\n  online: true,\n  lastOnline: TIMESTAMP\n}\n```\n\nWhen the device is offline, the value will be updated with `online: false`:\n\n```javascript\n{\n  online: false,\n  lastOnline: TIMESTAMP\n}\n```\n\nTo set up your own handlers on the presence object, you can call `onConnect()` and pass a callback. The method will be called with the `connectedDevice` database reference and you can set up your own handlers:\n\n```javascript\nconst presence = firestack.presence\n                          .on('users/connections');\npresence.onConnect((ref) =\u003e {\n  ref.onDisconnect().remove(); // Remove the entry\n  // or\n  ref.set({\n    location: someLocation\n  });\n  // or whatever you want as it's called with the database\n  // reference. All methods on the DatabaseRef object are\n  // available here on the `ref`\n})\n```\n\n### ServerValue\n\nFirebase provides some static values based upon the server. We can use the `ServerValue` constant to retrieve these. For instance, to grab the TIMESTAMP on the server, use the `TIMESTAMP` value:\n\n```javascript\nconst timestamp = firestack.ServerValue.TIMESTAMP\n```\n\n### Cloud Messaging\n\nAccess the device registration token\n\n```javascript\n  firestack.cloudMessaging.getToken().then(function (token) {\n    console.log('device token', token);\n  });\n```\n\nMonitor token generation\n\n```javascript\n  // add listener\n  firestack.cloudMessaging.listenForTokenRefresh(function (token) {\n    console.log('refresh device token', token);\n  });\n\n  // remove listener\n  firestack.cloudMessaging.unlistenForTokenRefresh();\n```\n\nSubscribe to topic\n\n```javascript\n  firestack.cloudMessaging.subscribeToTopic(\"topic_name\").then(function (topic) {\n      console.log('Subscribe:'+topic);\n  }).catch(function(err){\n       console.error(err);\n  });\n```\n\nUnsubscribe from topic\n\n```javascript\n  firestack.cloudMessaging.unsubscribeFromTopic(\"topic_name\").then(function (topic) {\n      console.log('unsubscribe:'+topic);\n  }).catch(function(err){\n       console.error(err);\n  });\n```\n\nReceive Messages\n\n```javascript\n  firestack.cloudMessaging.listenForReceiveNotification((msg) =\u003e{\n    console.log('Receive Messages:'+msg.data);\n    console.log('Receive Messages:'+msg.notification);\n\n  });\n```\n\n### Events\n\n#### on()\n\nWe can listen to arbitrary events fired by the Firebase library using the `on()` method. The `on()` method accepts a name and a function callback:\n\n```javascript\nfirestack.on('listenForAuth', (evt) =\u003e console.log('Got an event'));\n```\n\n#### off()\n\nTo unsubscribe to events fired by Firebase, we can call the `off()` method with the name of the event we want to unsubscribe.\n\n```javascript\nfirestack.off('listenForAuth');\n```\n\n## FirestackModule\n\nFirestack provides a built-in way to connect your Redux app using the `FirestackModule` export from Firestack.\n\n## Running with the `master` branch\n\nMost of our work is committed to the master branch. If you want to run the bleeding-edge version of Firestack, you'll need to follow these instructions.\n\nSince `react-native` doesn't like symlinks, we need to clone the raw repository into our `node_modules/` manually. First, in order to tell `react-native` we are using the package `react-native-firestack`, make sure to install the `npm` version:\n\n```bash\nnpm install --save react-native-firestack\n```\n\nAfter the `npm` version is installed, you can either clone the repo directly into our `node_modules/` directory:\n\n```bash\ngit clone https://github.com/fullstackreact/react-native-firestack.git ./node_modules/react-native-firestack\n```\n\nAlternatively, you can clone the repo somewhere else and `rsync` the directory over to the `node_modules/` directory.\n\n\u003e This is the method I use as it allows me to separate the codebases:\n\n```bash\ngit clone https://github.com/fullstackreact/react-native-firestack.git \\\n      ~/Development/react-native/mine/react-native-firestack/\n\n## And rsync\nrsync -avhW --delete \\\n      --exclude='node_modules' \\\n      --exclude='.git' \\\n      ~/Development/react-native/mine/react-native-firestack/ \\\n      ./node_modules/react-native-firestack/\n```\n\n## Contributing\n\nThis is _open-source_ software and we can make it rock for everyone through contributions.\n\nHow do you contribute? Check out our contribution guide at [CONTRIBUTING.md](https://github.com/fullstackreact/react-native-firestack/blob/master/Contributing.md)\n\n## TODO\n\nThe following is left to be done:\n\n- [x] Complete FirebaseModule functionality\n- [ ] Document FirebaseModule\n- [X] Add Android support\n  - auth/analytics/database/storage/presence are feature-complete. remoteconfig/messaging are mostly-there.\n- [x] Add Cloud Messaging\n  - [ ] Add JS api\n- [ ] Move to use swift (cleaner syntax)\n- [ ] TODO: Finish Facebook integration\n\n# Fullstack React Book\n\n\u003ca href=\"https://fullstackreact.com\"\u003e\n\u003cimg align=\"right\" src=\"https://cdn.rawgit.com/fullstackreact/react-yelp-clone/master/resources/readme/fullstack-react-hero-book.png\" alt=\"Fullstack React Book\" width=\"155\" height=\"250\" /\u003e\n\u003c/a\u003e\n\nThis repo was written and is maintained by the [Fullstack React](https://fullstackreact.com) team.\n\nIf you're looking to learn React, there's no faster way than by spending a few hours with the [Fullstack React book](https://fullstackreact.com).\n\n\u003cdiv style=\"clear:both\"\u003e\u003c/div\u003e\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffullstackreact%2Freact-native-firestack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffullstackreact%2Freact-native-firestack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffullstackreact%2Freact-native-firestack/lists"}