Skip to content

React-Native based boiler-plate code for Google, Facebook and Custom Login

License

Notifications You must be signed in to change notification settings

husnaintahir/Google-and-FB-Login

Repository files navigation

Google and FB Login in React-Native

This code is working well with react 16.8.3, react-native 0.59.5, react-native-fbsdk 0.8.0 and react-native-google-signin 2.0.0.

It is well tested in iOS 12.2 and Android 8.1

React-Native based boiler-plate code for Google, Facebook and Custom Login. All you have to do is get the required files from google firebase for ios/android for google login and an facebook app inside facebook developers for ios/android for FB Login. Further instruction for each platform is given below.

Following Features are implemented

  • Google Login with
  • Facebook Login with
  • Custom Login/Signup (Using our own server)
  • Redux
  • Redux-Thunk

You also need this repo for custom login and saving user's basic info from Google and Facebook login, as it was developed 100% for this react-native application.

Clone/download this repo, run npm install inside project directory to install required node_modules.

iOS setup

Google Login:

Follow this guide to get the configuration file, and replace it with already available GoogleService-Info.plist inside app-folder/ios/GoogleService-Info.plist.

Open GoogleService-Info.plist and copy REVERSED_CLIENT_ID, then Open Info.plist from app-folder/ios/googlefblogin/Info.plist and replace your-google-reverserd-client-id with your own REVERSED_CLIENT_ID

Facebook Login:

Follow this guide to configure a facebook app for iOS, Step 1 is must thing to do.

Then replace Your-fb-id with the id of your facebook App ID, also replace fb<Your-fb-id> with fbApp ID.

Reference Image given.

That's it for iOS setup, you are good to go to run the app.

If required install PODS on your machine.

Android setup

Google Login:

Follow this guid to get configuration file, and replace it with already available google-services.json. Complete the required steps to get the configuration file.

Facebook Login:

Follow this guide to configure a facebook app for Android. After facebook app is created, open app-folder/android/app/src/main/res/values/strings.xml and replace {your-fb-app-id} with facebook APP ID and {your-fb-login-protocol-scheme} with FB APP Scheme.

Before running the app make sure you have created Key Hashes and SHA1 for facebook and google login respectively. For Android, having the Key Hashes and SHA1 is a must for production and debug both build variants.

If you are facing any problem, just open issue, i will try my best to resolve this issue ASAP. Also you can reach me via Twitter

About

React-Native based boiler-plate code for Google, Facebook and Custom Login

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published