React Native Facebook Login tutorial – v0.37

Yesterday I faced some big problems while trying to get the Facebook login up and running in my React Native app. I couldn’t get it working with the official Facebook docs. I decided to write all of my steps down.

First of all, here is what I’m working with:

  • Win 10
  • React Native 0.37
  • NodeJs 6.9.1 LTS

After initialising  my app, I followed these steps:


  1. I couldn’t find a ‚react-native-fbsdk‘ folder in my node_modules. As a result

  2. could not find the composer.json in that folder. No folder, no files. I tried

  3. and got the folder. I continued with the official documentation.

  4. This command led to some changes on app.gradle, MainActivity.java, MainApplication.java and settings.gradle.
    I went on with the official guide here (React Native version > 0.30) and faced some problems with the imports (packages not available). I noticed some differences between the docs and the manual on the repositories page, so I went on with that guide.
  5. I followed the steps from chapter ‚If your react-native version is 0.29 or above‘. Imports could be found and gradle finally synced.
  6. After that, I went to this page and implemented code snippets as described in ‚Add Facebook App ID‘. 
  7. Finally the app started. I created the login button (docs ok for that). The following click to login resulted in another error (‚Not logged in‘).
  8. The last step was to finish the quick start guide (add my Android app to Facebook). My Android app was successfully added to Facebook (important: Generate the hash) and I was able to login.

Safari done. Login up and running. Easy going….noooooot!

 

Andre out.