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
The repo is here: https://github.com/fpatelm/flutter-fi...
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
📃On the firebase console, we create a new firebase project and activate the authentication phone number sign-in-method. Download google-service.json and insert it in the android directory on the Flutter project
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: 🔻🔻
✅Easy Flutter Firebase Timestamp into DateTime • Easy Flutter Firebase Timestamp into ...
✅ Flutter Firebase CRUD Cloud Firestore • Flutter Firebase CRUD (Create, Read, ...
✅ FlutterFire UI Firebase Auth Phone Number • Easy Flutter Firebase Phone Number Auth
✅ Calculator App in Flutter • Flutter Calculator App - Flutter Stat...
✅ MacOS Calculator App in Flutter • Flutter Tutorial Crash Course - MacOS...
🔻🔻Flutter Cupertino Chat App Series 🔻🔻
✅ 1: Flutter Bottom Navigation Bar • Easy Flutter Tab Bar - Flutter Chat A...
✅ 2: Easy Flutter Firebase Firestore • Easy Flutter Firebase Firestore - Flu...
✅ 3: Flutter Mobile Phone Verification UI • Easy Flutter Firebase Phone Number Au...
✅ 4: Easy Flutter Firebase Phone Number Authentication • Easy Flutter Firebase Phone Number Au...
✅ 5: User Record Cloud Firebase Firestore • User Record Flutter Firebase Firestor...
✅ 6: Easy Chat Messages Using Firebase Firestore • Easy Chat Messages Flutter Firebase F...
✅ 7: Easy Chat Messages Screen Firebase Firestore with MobX • Chats List Flutter Firebase Firestore...
✅ 8: Upload Profile Picture with Firebase Storage with MobX • Upload Picture Flutter Firebase Stora...
✅ 9: Search People with Firebase and MobX • Quick Search Bar Flutter Firebase Mob...
✅ 10: Flutter Firebase AuthGate Flutter Auth • Flutter Firebase AuthGate Firebase Au...
✅ 11: Flutter Firebase Infinite List • Flutter Firebase Infinite List - Flut...
Like 👍, Share 🔗, Comment 📃 and Subscribe 🔔
#firebaseauth #flutter #learnflutter #dart #fluttercalculator #flutterdev #dartdev #fluterando #flutterdeveloper #flutterfirebase #cloudfirestore