{"id":14974296,"url":"https://github.com/oijusti/react-native-firebaseui-auth","last_synced_at":"2025-04-06T01:06:17.249Z","repository":{"id":38852298,"uuid":"254757505","full_name":"oijusti/react-native-firebaseui-auth","owner":"oijusti","description":"Easily add sign-in to your React Native app with FirebaseUI ","archived":false,"fork":false,"pushed_at":"2025-03-10T00:23:32.000Z","size":1824,"stargazers_count":46,"open_issues_count":0,"forks_count":10,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-02T09:45:05.663Z","etag":null,"topics":["android","auth","firebase","firebaseui","ios","javascript","react","react-native","react-native-app"],"latest_commit_sha":null,"homepage":null,"language":"Objective-C","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/oijusti.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":["https://paypal.me/oijusti"]}},"created_at":"2020-04-10T23:41:23.000Z","updated_at":"2025-03-22T09:46:52.000Z","dependencies_parsed_at":"2024-09-27T18:43:06.262Z","dependency_job_id":"5382d1f6-b1e9-4457-9a69-8ab53a5ddf9a","html_url":"https://github.com/oijusti/react-native-firebaseui-auth","commit_stats":{"total_commits":98,"total_committers":7,"mean_commits":14.0,"dds":"0.37755102040816324","last_synced_commit":"d81a13e64f72e54dfb68f7fceb68e13d0bc8eb1c"},"previous_names":[],"tags_count":23,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oijusti%2Freact-native-firebaseui-auth","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oijusti%2Freact-native-firebaseui-auth/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oijusti%2Freact-native-firebaseui-auth/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oijusti%2Freact-native-firebaseui-auth/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oijusti","download_url":"https://codeload.github.com/oijusti/react-native-firebaseui-auth/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247419859,"owners_count":20936012,"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":["android","auth","firebase","firebaseui","ios","javascript","react","react-native","react-native-app"],"created_at":"2024-09-24T13:50:21.517Z","updated_at":"2025-04-06T01:06:17.216Z","avatar_url":"https://github.com/oijusti.png","language":"Objective-C","funding_links":["https://paypal.me/oijusti"],"categories":[],"sub_categories":[],"readme":"\n[![oijusti](https://circleci.com/gh/oijusti/react-native-firebaseui-auth.svg?style=svg)](https://circleci.com/gh/oijusti/react-native-firebaseui-auth)\n\n[prs]: https://img.shields.io/badge/PRs-welcome-brightgreen.svg\n[prs-url]: https://github.com/oijusti/react-native-firebaseui-auth#contributing\n\n[![npm version](https://badge.fury.io/js/react-native-firebaseui-auth.svg)](https://www.npmjs.com/package/react-native-firebaseui-auth) [![PR's welcome][prs]][prs-url]\n\n\u003ca href=\"https://npmcharts.com/compare/react-native-firebaseui-auth?minimal=true\"\u003e\n  \u003cimg  src=\"https://img.shields.io/npm/dy/react-native-firebaseui-auth?color=46c71f\"/\u003e \n\u003c/a\u003e\n\n\u003ca href=\"https://npmcharts.com/compare/react-native-firebaseui-auth?minimal=true\"\u003e\n  \u003cimg src=\"https://img.shields.io/npm/dm/react-native-firebaseui-auth.svg\"\u003e\n\u003c/a\u003e\n\n\u003ca href=\"https://packagephobia.now.sh/result?p=react-native-firebaseui-auth\"\u003e\n  \u003cimg src=\"https://packagephobia.now.sh/badge?p=react-native-firebaseui-auth\" alt=\"install size\"\u003e\n\u003c/a\u003e\n\n\n# react-native-firebaseui-auth\n\nEasily add sign-in to your React Native app with FirebaseUI\n\n\u003cdiv align=\"left\"\u003e\n\u003cp float=\"left\"\u003e\n\u003cimg src=\"https://raw.githubusercontent.com/oijusti/oijusti.github.io/HEAD/react-native-firebaseui-auth/firebaseui-android.png\" width=\"150\"/\u003e\n\u003cimg src=\"https://raw.githubusercontent.com/oijusti/oijusti.github.io/HEAD/react-native-firebaseui-auth/firebaseui-ios.png\" width=\"150\"/\u003e\n\u003c/p\u003e\n\u003c/div\u003e\n\n## Getting started\n\n### Add Firebase to your  project\n\n#### Android:\n\n 1. Follow the [Android setup guide](https://firebase.google.com/docs/android/setup)\n 2. Follow the [sign-in methods guide](https://firebase.google.com/docs/auth/android/firebaseui#set_up_sign-in_methods)    \n\n#### iOS:\n1. Follow the [iOS setup guide](https://firebase.google.com/docs/ios/setup)\n    \n2.  Add FirebaseUI to your Podfile:\n    \n    ```\n    pod 'FirebaseUI'\n    ```\n    Run ` $ pod update`\n3. Follow the [sign-in methods guide](https://firebase.google.com/docs/auth/ios/firebaseui#set_up_sign-in_methods)    \n\n### Installation \n\n`$ npm install react-native-firebaseui-auth --save`\n\nor \n\n`$ yarn add react-native-firebaseui-auth`\n\n\n### Linking (RN \u003e= 0.60 skip this step)\n\nRN \u003c= 0.59 only\n\n#### Automatic\n\n`$ react-native link react-native-firebaseui-auth`\n\n#### Manual\n\n#### iOS\n\n1. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]`\n2. Go to `node_modules` ➜ `react-native-firebaseui-auth` and add `RNFirebaseuiAuth.xcodeproj`\n3. In XCode, in the project navigator, select your project. Add `libRNFirebaseuiAuth.a` to your project's `Build Phases` ➜ `Link Binary With Libraries`\n4. Run your project (`Cmd+R`)\n\n#### Android\n\n1. Open up `android/app/src/main/java/[...]/MainApplication.java`\n  - Add `import com.oijusti.firebaseuiauth.RNFirebaseuiAuthPackage;` to the imports at the top of the file\n  - Add `new RNFirebaseuiAuthPackage()` to the list returned by the `getPackages()` method\n2. Append the following lines to `android/settings.gradle`:\n    ```\n    include ':react-native-firebaseui-auth'\n    project(':react-native-firebaseui-auth').projectDir = new File(rootProject.projectDir,  '../node_modules/react-native-firebaseui-auth/android')\n    ```\n3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:\n    ```\n      implementation project(':react-native-firebaseui-auth')\n    ```\n\n\n## Usage\n\n```javascript\nimport Auth, {AuthEventEmitter, AuthEvents} from 'react-native-firebaseui-auth';\n\n...\n\n  componentDidMount() {\n    this.eventListener = AuthEventEmitter.addListener(\n      AuthEvents.AUTH_STATE_CHANGED,\n      event =\u003e {\n        console.log('user:', event.user);\n      }\n    );\n  }\n\n  componentWillUnmount() {\n    this.eventListener.remove(); //Removes the listener\n  }\n\n...\n\n  const config = {\n    providers: [\n      'anonymous',\n      'facebook', \n      'google', \n      'email', \n      'phone', \n      'apple', \n      'yahoo', \n      'github', \n      'twitter', \n      'microsoft'\n    ],\n    tosUrl: 'https://example.com/tos.htm',\n    privacyPolicyUrl: 'https://example.com/privacypolicy.htm',\n  };\n\n  Auth.signIn(config)\n    .then(user =\u003e console.log(user))\n    .catch(err =\u003e console.log(err));\n\n...\n\n  Auth.getCurrentUser().then(user =\u003e console.log(user));\n\n...\n\n  Auth.signOut().then(res =\u003e console.log(res));\n\n...\n\n  Auth.deleteUser().then(res =\u003e console.log(res));\n\n...\n```\n\n### Returns: `user`\n\nField | Type | Description |\n--- | --- | --- |\nuid |`string`| The provider's user ID for the user. |\ndisplayName |`string`| The name of the user. |\nphotoURL |`string`| The URL of the user's profile photo. |\nemail |`string`| Indicates the email address associated with this user ~~has been verified~~. |\nphoneNumber |`string`| A phone number associated with the user. |\nproviderId |`string`| The provider identifier. |\nisNewUser |`boolean`| Indicates whether or not the current user was signed in for the first time. |\ncreationTimestamp |`number`| Stores the timestamp at which this account was created as dictated by the server clock in milliseconds since epoch. |\nlastSignInTimestamp |`number`| Stores the last signin timestamp as dictated by the server clock in milliseconds since epoch. |\n\n### UI Customization\nOptionally, you can use the option `customizations` to change the look of the authentication screens. This does not apply to the actual sign-in buttons and their position. What you can change depends on the platform.\n\n\u003cdiv align=\"left\"\u003e\n\u003cp float=\"left\"\u003e\n\u003cimg src=\"https://raw.githubusercontent.com/oijusti/oijusti.github.io/HEAD/react-native-firebaseui-auth/firebaseui-android-custom.png\" height=\"300\"/\u003e\n\u003cimg src=\"https://raw.githubusercontent.com/oijusti/oijusti.github.io/HEAD/react-native-firebaseui-auth/firebaseui-ios-custom.png\" height=\"300\"/\u003e\n\n\n##### Android\nThe values available for android customization are as follows,\n```javascript\n  const config = {\n    ...\n    customizations: [\n      'theme',\n      'logo'\n    ],\n  };\n```\nFirst add FirebaseUI in your build.gradle (:app),\n```javascript\ndependencies {\n    implementation 'com.firebaseui:firebase-ui-auth:6.4.0'\n    ...\n```\n\nFor `theme`, add the next style in your `styles.xml`, then copy into the `drawable` folder an image to use for background and name it `auth_background.png`.\n```javascript\n    \u003cstyle name=\"AuthTheme\" parent=\"FirebaseUI\"\u003e\n        \u003c!-- \u003citem name=\"colorPrimary\"\u003e@color/colorPrimary\u003c/item\u003e --\u003e\n        \u003c!-- \u003citem name=\"colorPrimaryDark\"\u003e@color/colorPrimaryDark\u003c/item\u003e --\u003e\n        \u003c!-- \u003citem name=\"colorAccent\"\u003e@color/colorAccent\u003c/item\u003e --\u003e\n\n        \u003citem name=\"colorControlNormal\"\u003e@android:color/white\u003c/item\u003e\n        \u003citem name=\"colorControlActivated\"\u003e@android:color/white\u003c/item\u003e\n        \u003citem name=\"colorControlHighlight\"\u003e@android:color/white\u003c/item\u003e\n        \u003citem name=\"android:windowBackground\"\u003e@drawable/auth_background\u003c/item\u003e\n    \u003c/style\u003e\n```\nFor `logo`, copy an image in the `drawable` folder and name it `auth_logo.png`.\n\n\n##### iOS\nThe values available for iOS customization correspond to specific screens and are as follows,\n```javascript\n  const config = {\n    ...\n    customizations: [\n      'auth_picker',\n      'email_entry',\n      'password_sign_in',\n      'password_sign_up',\n      'password_recovery',\n      'password_verification'\n    ],\n  };\n```\nOpen your project in `XCode` and add the `.xib` file of the screen you want to customize. The .xib files are located in `./ios/custom-screens/` of this library. Let's say, you want to customize the `auth-picker` screen, add the file `FUICustomAuthPickerViewController.xib` and use the XCode tools to add it labels, images, change colors, and so on.\n\n### Email Password Settings\nYou can control whether new users can sign in or not by using the option `allowNewEmailAccounts`. Also, if you do not want to require the user name during sign up you can set the option `requireDisplayName` to false.\n```javascript\n  const config = {\n    ...\n    allowNewEmailAccounts: false,\n    requireDisplayName: false,\n  };\n```\n\n### Anonymous User upgrade Settings\nWhen an anonymous user signs in or signs up with a permanent account, the `autoUpgradeAnonymousUsers` option allows you to link the existing account (anonymous) with permanent account. This way the user can continue with what they were doing before signing up. By default this option is disabled.\n```javascript\n  const config = {\n    ...\n    autoUpgradeAnonymousUsers: true,\n  };\n```\n\n## Example Project\nDownload example from [react-native-firebaseui-auth-example](https://github.com/oijusti/react-native-firebaseui-auth-example)\n\nCreate a project in the [Firebase Console](https://console.firebase.google.com) and add apps for Android and iOS. Then enable Email/Password provider in Authentication.\n\n#### Android\nMake sure you type `com.example` in the `Android package name` field.\n\nDownload the file `google-services.json` in the android/app folder.\n\n#### iOS\nMake sure you type `com.example` in the `iOS bundle ID` field.\n\nDownload the file ``GoogleService-Info.plist`` in the ios/example folder and add it into the project using xcode.\n\nUpdate pods `$ pod install`\n\n## Contributing\n\nFeel free to report bugs, ask questions and submit a PR.\n\nIf this is your first open source contribution, please take a look at this [guide](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github) .\n\n## Find this library useful?\n\nPlease give me a star ✭ if you like it!\n\n## License\n\n(MIT)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foijusti%2Freact-native-firebaseui-auth","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foijusti%2Freact-native-firebaseui-auth","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foijusti%2Freact-native-firebaseui-auth/lists"}