Flutter Web Tutorial: Firebase Email/Password Authentication and Google Sign In

In this tutorial, you'll learn how to implement Email/Password authentication and Google Sign In functionality in Flutter Web using Firebase. This comprehensive guide covers every step from setting up a Firebase project to creating responsive authentication screens and integrating Google Sign In. By the end of this tutorial, you'll be able to build robust authentication systems for your Flutter Web applications. So, whether you're a beginner or an experienced developer, this video is perfect for you. Let's get started!

In this video, we will mainly look into two types of user authentication:

Authentication via email and password
Authentication via Google Sign-In

00:00:00 Introduction
00:00:52 Creating a new Firebase project
00:02:09 Create Google Sign-In OAuth client ID
00:05:27 Initialize Firebase
00:05:45 Method authenticating using Google sign in
00:06:51 Method authenticating using email and password
00:08:12 Method Auto-login
00:08:40 Building the AuthDialog UI
00:11:34 Google Sign-In button
00:12:29 Responsive widget
00:12:36 Top bar widget
00:14:18 Drawer widget
00:15:37 Home Page UI

If you want to get the source code, please subscribe to the channel, add comment

Play List Tutorials:

fluttermaker#
Flutter_maker#
#Flutter #Firebase #Authentication #GoogleSignIn #WebDevelopment #MobileDevelopment #AppDevelopment #TechTutorial #FlutterWeb #FirebaseAuthentication #FlutterApp #Coding #Programming #WebCoding #Google #WebApps #WebDesign #GoogleAPI #FlutterCommunity #GoogleSignOn

[Charlie-lesp]

It's been 6 months since I saw this video which has helped me a lot, and to date I have 2 apps, one in production working for android and web, and another in development....thank you very much dear friend 😆😆🙏🙏🙏👋

[ishangoswami]

Thank you for making this video, sent you the email for source code.

[craigmalone]

Best implementation of flutter web authentication. Terrific display of user status in the app bar and drawer

[atiqah-eymf]

Thank you for this great video, I already sent you the email for source code.

[harsh.on.strings]

Thank you for making this video, sent you an email for source code.

[CrazyOrdinal]

How can we use Redirect instead of popup for Google authentication. On many browsers, users found the popup was blocked for the first attempt

[raghadalshamari-lp]

great tutorial i send to your email plz send a source code

[ramsmart]

Thank you for creating this video. I have sent you an email requesting the source code.

[jinayshah]

Hey very nice and detailed video it was very easy in understanding and way step by step, can you please share the source code

[Charlie-lesp]

Let's consider this contribution to the community, not as a tutorial, but as a work for all human beings, thank you very much, dear FLUTTER MAKER, I owe you one and as soon as I can recharge my Paypal, I will write to you again to send you 5 usd. ..THANK YOU

[shahidparvez]

Thanks for the video🥰. I sent you the email for the source code

[murugurthy]

Amazing work ❤
Hoping to work on such code asap

[Charlie-lesp]

incredible contribution, thank you very much, greetings from Colombia... a hug, and fascinating wisdom, you are the best... I already sent you the email for the source code, thank you very much

[VoyagerGames]

Sent you and email! Thanks for the video!

[toshakbhat]

Thank you so much . Can you please provide the source code !

[malluvocalist]

when i host google sign in is not working

[HammadKhanYT]

Great video, this is exactly what I wanted! Where can I get the code from?

[ahmedfouda]

Hey there! Great tutorial, but I'm having trouble getting it to work when I deploy it. Any tips?

[kamalkishorkumar]

Google login is working on localhost but not on the production website, please help.

[abhishekthapliyal]

How can we do sign in via phone no on Flutter web?