• Google
• Facebook
• Twitter
• LinkedIn
• Instagram

Install node modules

Runs the app in the development mode. Open https://localhost:3000 to view it in the browser. Facebook SDK only works with https so be sure that url set to https

The page will reload if you make edits. You will also see any lint errors in the console.

Launches the test runner in the interactive watch mode. See the section about running tests for more information.

Builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes. Your app is ready to be deployed!

See the section about deployment for more information click me .

Deploys project to firebase host

After enabling Google, Facebook and Twitter sign-in medhods on firebase Authentication page, you have to change only the file below...

// src/config.js
export default {
  firebase: {
    apiKey: '{APIKEY}',
    authDomain: '{FIREBASE_PROJECT_ID}.firebaseapp.com',
    projectId: '{FIREBASE_PROJECT_ID}',
  },
  instagram: {
    clientId: '{CLIENT_ID}',
    redirectUri:
      process.env.NODE_ENV === 'production' // eslint-disable-line
        ? 'https://{FIREBASE_PROJECT_ID}.firebaseapp.com/complete-register/'
        : 'http://localhost:3000/complete-register/',
    responseType: 'token',
  },
}

//public/index.html
// Instagram API
<script type="text/javascript" src="https://platform.linkedin.com/in.js">
    api_key: {LINKEDIN_API}
    authorize: true
    scope: r_basicprofile r_emailaddress
</script>

 //Facebook SDK
 <script>
  window.fbAsyncInit = function () {
    FB.init({
      appId: {FACEBOOK_APP_ID},
      autoLogAppEvents: true,
      xfbml: true,
      version: 'v3.0',
    });
  };

  (function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) { return; }
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>

You can set auth for Google, Facebook and Twitter with Firebase Spark Pricing Plan which is free. For LinkedIn and Instagram auths you must upgrade to paid pricing plan to Blaze(pay as you go).

Firebase provides you to access basic and additional user info (by using scopes).

For more info check step by step Firebase docs for Authenticate Using Google Sign-In with JavaScript

Facebook provides SDK for Web which you can access basic and additional user info (by using scopes).

For more info check step by step Facebook developers docs for Facebook Login for the Web with the JavaScript SDK

Firebase provides you to access basic and additional user info (by using scopes).

For more info check step by step Firebase docs for Authenticate Using Facebook Login with JavaScript

Firebase provides you to access basic and additional user info (by using scopes).

For more info check step by step Firebase docs for Authenticate Using Twitter in JavaScript

LinkedIn JavaScript SDK provides you to access basic and additional user info (by using scopes).

For more info check step by step LinkedIn developers docs for Getting Started with the JavaScript SDK

Instagram Client-Side (Implicit) Authentication provides you basic profile information(e.g: first_name, last_name, bio...). All permissions require approval to be used out of Sandbox, you have wait for approval for that. You cant get email of user until you got approved.

For more info check step by step Instagram developers docs for Client-Side (Implicit) Authentication