Easy Flutter Firebase Phone Number Auth

How to perform Firebase Auth using FlutterFire Ui auth on your Flutter App? You will learn to do mobile verification using phone number authentication with Flutter Firebase Auth FlutterFire UI. I will teach you the configurations you need to do in order to receive an SMS code from Firebase Auth onto your Flutter App using FlutterFire UI and Android Configs.

In this tutorial, we are going to focus especially on the Flutter Firebase Phone Auth using Firebase Emulator.

Flutter is a modern UI toolkit for creating beautiful UI that uses the Skia engine to draw elements to the screen.

TABLE OF CONTENTS
00:00 Intro

00:17 Flutter Firebase Repo Template

00:28 Presentation of the code template
📃 This template contains the integration of Firebase Firestore, Firebase Authentication, and Firebase Storage dependencies and also the configuration to enable the app to target Firebase Cloud or Firebase Emulators. We will have two screens in this app, the standard out-of-the-box login screen, and the started counter home page.

01:33 Firebase setup for Android

03:02 Init firebase services
📃With the help of firebase CLI, we initialize the firebase services, more specifically the authentication phone number sign-in-method for the flutter app.

04:20 FlutterFire Auth UI
📃Integratethe FlutterFire Auth UI on the flutter App by adding a flutter widget gateway and query the FirebaseAuth to understand if the user is authenticated already or not.

07:46 Add configurations to the Android Manifest file
09:50 Demo of User authentication
11:12 Add the sign-out button
12:39 Final demo
12:54 Take away
14:35 Conclusion

🔻🔻 You might like the following videos: 🔻🔻

🔻🔻Flutter Cupertino Chat App Series 🔻🔻

Like 👍, Share 🔗, Comment 📃 and Subscribe 🔔

#firebaseauth #flutter #learnflutter #dart #fluttercalculator #flutterdev #dartdev #fluterando #flutterdeveloper #flutterfirebase #cloudfirestore

[keynotecast]

Are you going to use the standard FlutterFire Phone Auth UI in your project?
Let me know here in the comments.

Next video I will show you how to use a fully custom auth UI without the need to write the auth logic --> thanks for the Flutter Fire controllers ;)

If you like, like it and share it, and if you want to keep learning Flutter like a pro, subscribe to the channel, thanks ;)

More cool flutter content is on the way!!

[stanleyezeaku]

Nice one. I followed the steps, however I am not receiving otp sms both on my IDE and Device.

[DavidHust]

Can you do a FlutterFire with Google Sign In video for both Android and iOS?

[keynotecast]

The following might be useful for you :)

🔻 You might like the following videos: 🔻

🔻 Cupertino Chat App Series 🔻

[PerezJuan]

Thank you for sharing. I am using the repo and I have followed all what you did but it doesn't work bro. It says:
D/InputMethodManager(10287): showSoftInput() 0, 0-1080, 2148 #1 aid=1073741824} flags=0 reason=SHOW_SOFT_INPUT
D/InsetsController(10287): show(ime(), fromIme=true)
D/EGL_emulation(10287): app_time_stats: avg=347.46ms min=89.93ms max=478.62ms count=3
W/System (10287): Ignoring header X-Firebase-Locale because its value was null.
D/InputMethodManager(10287): showSoftInput() 0, 0-1080, 2148 #1 aid=1073741824} flags=0 reason=SHOW_SOFT_INPUT
D/InputMethodManager(10287): showSoftInput() 0, 0-1080, 2148 #1 aid=1073741824} flags=0 reason=SHOW_SOFT_INPUT
I/AssistStructure(10287): Flattened final assist data: 444 bytes, containing 1 windows, 3 views
D/InsetsController(10287): show(ime(), fromIme=true)
D/InsetsController(10287): show(ime(), fromIme=true)
D/InsetsController(10287): show(ime(), fromIme=true)

Can you help me? thanks