How to add Firebase authentication for email/pass, phone, and google to an existing UI in flutter

Question

So basically, I have already made the UI for the sign in, sign up, etc screens and now I want to implement firebase into it, does anyone know how to do this? Anything could be useful

Answer 1

Here's a quick recap on how to do this, although i really recommend reading firebase's official tutorial on this,

first you need to add the firebase plugin:

• go to the firbase_auth pub page, and follow the "installing" instructions there

• open a firebase account, add a project using the firebase console , and follow the tutorial to connect you firebase project you created on the website to your app

• now lets say you have some textfields and a button to register/log in, you want to add a "controller" to the text field:

  final controller = TextEditingController();

and then in the onPressed of the button, you want to provider a function that calls:

String resultText = controller.text

now you can use the resultText string and send it to firebase (do the same with 2 controllers, one for email and one for password)

first initialize the firebase instance:

import 'package:firebase_auth/firebase_auth.dart';
FirebaseAuth auth = FirebaseAuth.instance;

then anywhere in your app your can call (for example with the string variables you got from the controllers of the text fields):

UserCredential result = await auth.createUserWithEmailAndPassword(
      email: email, password: password);
User user = result.user;

and then you can check if the user is received successfully, and condition moving on to the next screen accordingly

this is just an example for registering, you will need different code to check if the user exists on login, but its all through the auth api, which you can read on in the first link I supplied

this is just to give you an example of the steps required to get this done, and i'm over simplifying stuff, but should get you started:)