npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

react-native-simple-auth-email

v2.2.0

Published

Native social authentication for React Native

Downloads

10

Readme

react-native-simple-auth Build Status

OAuth login for React Native

Screencast

iOS | Android :-------------------------:|:-------------------------: Screencast | Screencast

Source of example app: https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample

Install

  • yarn add react-native-simple-auth
  • Set up deep linking for your Android and iOS application using the instructions on the react-native website (set the launchMode of MainActivity to singleTask in AndroidManifest.xml, create the deep link schemes in Providers Setup)
  • Set up your OAuth Providers

Providers Setup

Google

  • Go to the developer console and create credentials for an iOS application (you can also use these for your Android app). More instructions on the Google support site.
  • The "Bundle ID" should contain a dot, eg com.reactnativesimpleauth
  • Your configuration object should contain the 'Client ID' as appId and 'Bundle ID' in the callback (note the single /, you can put anything as the path), eg
{
  appId: '123-123abc.apps.googleusercontent.com',
  callback: 'com.reactnativesimpleauthexample:/oauth2redirect'
}
  • Add the deep link scheme for the callback (Your Bundle ID, eg com.reactnativesimpleauthexample) to your AndroidManifest.xml eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33
  • Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes

Facebook

  • Create an app on the Facebook developers website
  • In Settings, click Add Platform
  • Select iOS, and in the Bundle ID field, add fb{your App ID} eg fb1234567890 (You can use the same configuration for Android)
  • Your configuration object should contain the 'Appid ID' as appId and 'Bundle ID' in the callback (you must put ://authorize), eg
{
  appId: '1234567890',
  callback: 'fb1234567890://authorize',
  scope: 'user_friends', // you can override the default scope here
  fields: ['email', 'first_name', 'last_name'], // you can override the default fields here
}
  • Add the deep link scheme for the callback (Your Bundle ID, eg fb1234567890) to your AndroidManifest.xml eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33
  • Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes (Due to A Facebook bug, this should always be the top one in the list)

Twitter

  • Create an app on https://apps.twitter.com
  • You can put any valid URL as the callback url.
  • Your configuration object should contain the 'Consumer Key (API Key)' as appId, the 'Consumer Secret' ass appSecret and the Twitter App name in the callback, eg
{
  appId: 'abc1234567890',
  appSecret: 'cba0987654321',
  callback: 'testapp://authorize',
}
  • Add the deep link scheme for the callback (Your App Name, eg testapp) to your AndroidManifest.xml eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33
  • Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes (Due to A Facebook bug, this should always be the top one in the list)

Tumblr

  • Create an app on https://www.tumblr.com/oauth/apps
  • You can put any valid URL as the callback url.
  • Your configuration object should contain the 'OAuth Consumer Key' as appId, the 'OAuth Consumer Secret' ass appSecret and any callback, eg
{
  appId: '1234567890abc',
  appSecret: '1234567890abc',
  callback: 'testapp://authorize',
}
  • Add the deep link scheme for the callback (Your App Name, eg testapp) to your AndroidManifest.xml eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33
  • Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes (Due to A Facebook bug, this should always be the top one in the list)

Usage

Create a configuration object for each of the providers you want to authorize with (required keys are in parenthesis):

  • google (appId, callback)
  • facebook (appId, callback)
  • twitter (appId, appSecret, callback)
  • tumblr (appId, appSecret, callback)

See secrets.example.js.

import { google, facebook, twitter, tumblr } from 'react-native-simple-auth';

google({
  appId: '123-123abc.apps.googleusercontent.com',
  callback: 'com.reactnativesimpleauthexample:/oauth2redirect',
}).then((info) => {
  // info.user - user details from the provider
  // info.credentials - tokens from the provider
}).catch((error) => {
  // error.code
  // error.description
});

License

react-native-simple-auth is released under the MIT license.