Day 12: React Native + Firebase Authentication

Victor Bruce-Crabbe
3 min readFeb 5, 2020

--

It’s day 12 of my #ReactNativeIn30Days series. In today’s post, I will talk about how to add authentication to your React Native application using firebase.

  • What is firebase
  • Setting up firebase with react native
  • Registering a User (Email and Password sign-in method)
  • Authenticating a User (Login)
  • Demo

Firebase

Firebase is a backend-as-a-service (BAAS) platform that provides developers with a range of tools to build full-stack applications for both web and mobile platforms.

Firebase comes with features like authentication, database(NoSQL), cloud function, storage, analytics, etc.

Setting up Firebase with React Native

  1. You should have a google account first before you can start using firebase services. If you already have an account, head over to https://console.firebase.google.com/ to sign in with your email.
  2. Create a project on firebase. After a project has been created, you’ll be provided with a project setting key. This key will be based on the platform you’re using firebase in. If you’re using firebase within Android or iOS, there is a separate key for that. Likewise, if you’re using firebase for the web, a configuration key is provided so that you can connect your application to your firebase project.
  3. Within react-native run the command npm i firebase to install firebase in our project
  4. Copy the configuration settings from firebase into your react-native project and initialize firebase.
  5. Finally, import firebase so that you can have access to certain functions methods

Registering A User (Email and Password sign-in method)

Registering a user using firebase requires just a few lines of code. But before anything else, you must make sure that you have enabled authentication in your firebase project. Firebase base comes with a whole lot of sign-in methods. Some of them are signing in with Email and Password, google, Facebook, etc.

To register a user using the email and password sign-in method, pass your email and password to the method:

firebase.auth().createUserWithEmailAndPassword(email, password)

Authenticating A User (Login)

In most mobile apps, it is very common for you to provide your email and password as a form of verifying who you are before access is granted to you to navigate to certain screens of the app.

Authenticating a user using firebase requires few lines of code. Use the method:

firebase.auth().signInWithEmailAndPassword(email, password)

Demo:

--

--

Victor Bruce-Crabbe
Victor Bruce-Crabbe

Written by Victor Bruce-Crabbe

[Available for Hire]. I share my learning experience through writing based on what I will want to read when learning a new concept to help others.

No responses yet