Flutter — Firebase authentication using email_id and password | Flutter web tutorials | FirebaseAuth
In this article we shall discuss about how to make Firebase authentication using email_id and password in our flutter web app.
firebase_auth | Flutter Package
A Flutter plugin to use the Firebase Authentication API. To learn more about Firebase Auth, please visit the Firebase…
firebase_auth_web | Flutter Package
The web implementation of firebase_auth. To get started with Firebase Authentication on Web, please see the…
In our flutter web app, we will be having two textformFields, one for accepting email_id and another for getting the password from the user. Once user enters a valid email_id and password, they will be navigated to the homepage which contains a logout button in it, for logging out the user on demand.
- Add Firebase credentials:
Add your Firebase credentials in
index.html file present in
web folder of your project directory. You can get your Firebase credentials from the Firebase console after creating a web app project in it.
2. Logic for switching between screens:
After providing valid credential (email_id and password) the user will be navigated to homepage, similarly when user presses the logout button, they shall be logged-out and navigated back to the login page again. This part of switching between screens is monitored with the help of
authStateChanges() event and
StreamBuilder widget as follows.
3. Logic for sign-in to firebase:
To sign-in to firebase we will be making use of
createUserWithEmailAndPassword() event, which accepts email_id and password for authentication. This in turn will also create an entry in the firebase console. Moreover only one entry can be created using an email_id (i.e., no two entries will have same email_id or in other words, we can’t sign-up multiple times using the same email_id unless that particular email_id is deleted from the firebase console).
4. Logic for sign-out:
Well that’s it. Call these methods [
signOut()] on respective button clicks to see them in action.
This is how we can make use of Firebase Authentication using email_id and password in our Flutter Web application.
Get the complete source code here 👉: https://github.com/vijayinyoutube/firebase_auth_email_password_public
Check out all my Flutter related blogs here.,👇
Other articles you may like.,
Shared Preferences in Flutter
Store the data locally in Flutter app using Shared Preferences.
Setting up your Flutter app for publishing in Play Store.
Before publishing our Flutter app in Google Play Store we need to brush up few feature to make sure that the app is…
Creating Desktop Apps using Flutter
In this article we will discuss about how to create and run a desktop app using Flutter.
If you want to know more about Flutter and various Widgets in Flutter…?🤓 Then visit my channel 👉🏻 vijaycreations🚩