Facebook login in Android using React and Expo
Many mobile applications today allow users to login with third-party authentication such as Facebook. In today's post, I am going to show you how easy it is to set up and build in Android using React & Expo framework but the idea should be applicable to other frameworks.
- Generate Facebook App ID for your application
Create an account if you have not had so, and go to https://developers.facebook.com/apps/
Choose Create App -> Build connected experiences, fill up the form and you are good to go. You should be able to see your App ID in the app dashboard page. We will need to use this App ID when calling Facebook Login API.
2. Prepare your React Expo project
In Expo docs, refer to https://docs.expo.io/versions/latest/sdk/facebook/ where it explains how to install the package with code example. You should be able to create a simple login page based on the sample code which is basically calling Expo’s Facebook.initializeAsync function (pass it with Facebook App ID created in the first step) and using Facebook Graph API to fetch user info
3. Write the code
In my example, I am using reducer function “useReducer” in React so that I can manage different login states for example after login I want to show welcome message as shown in line 18 in below code snippets.
4. Test login
Once you hook the function with the UI component such as button, you can test it. Upon clicking on the button, it will show login box for you to enter Facebook credentials.
How about logout function? Well, Expo Facebook does have function Facebook.logOutAsync but when I try to login again, it will not show the login box anymore and used the previously entered credentials automatically.
So I decided to call Graph API manually and force delete the Facebook session’s token every time I logout. This allows me to re-enter the credentials.
Hope this article helps you implement Facebook login and logout to your React Native mobile application. Cheers.
Please follow me if you find this article useful, it would motivate me to write more useful articles and helping others to learn. Thank you.
