 Hey, everybody, it's Brian and this is an unofficial tutorial where you're gonna cover flutter We're gonna cover Google sign-in and flutter authentication with firebase. However, I'm not gonna make like a full-blown tutorial We're gonna actually try to figure out a problem First off in case you've been wondering where the heck I've been at. I've been making tutorials out on you to me calm Definitely check those out. I know it says it for sale, but if you visit the voidrums Facebook group I'm often posting free coupons out there So if you're a starving college student message me in the voidrums Facebook group, and I will give you a free coupon all right, so The crux of the matter here is we want to use firebase authentication and let me back up just to smidge Let's say you don't know what firebase is Firebase is a on online always-on Real-time database and storage along with messaging and a whole slew of other analytics attached to it It's from Google. It's actually kind of amazing One of the reasons why I picked flutter is because I highly suspect Google is going to take their firebase product with their flutter product and kind of marry them together very tightly Which will make flutter just hands down one of the best mobile platforms out there I actually kind of think flutter is kind of leaning in that direction, but I digress anyway So what we have before you is a very basic firebase console I literally just open this up and said I'm new to firebase hit me and we have before us It wants to get started. We're gonna actually build a fire boys. Yeah fire base Android application But we want to use Google sign-in. So there's some prerequisites to this tutorial First thing I've got a blank firebase. I have done very little if any modifications The only modification I have done is I've gone into authentication and I've gone into sign-in method and I have enabled Google sign-in and you'll have to follow directions on the screen. You'll have to have like a project and Some people are kind of wary about showing this information. I don't care because I'm just gonna delete all this crap when I'm done So there's Google and I also did email and password, but we're gonna focus on Google authentication I know there's also like Facebook and Twitter and all so there's stuff Which I'm not going to cover in this video. I may cover at some point so The other prerequisite is that we are going to do and whoopsie Android application Not an iOS application because I'm on Linux and I love Linux. So anyways Let me jump over to Android the prerequisite here with Android studio is You have to have the play store installed on your emulator I'm using the nexus 5 with API 27 with play store That means you're gonna have to have a valid email address and you're gonna have to use a valid play account and all that stuff You'll have to set that all up. I've already got the emulator running. Hello right here So we're gonna give that a shot That's a lot of prerequisites so far the other issue is These two packages don't really work well together if you got the firebase off and You go into their home page on GitHub and You go to issues you see there's some issues going on here I have been posting a lot of issues because I'm working on the flutter advanced tutorials on Udemy and this thing is not working And it's just straight up pissing me off. So I thought we would just fix this I went through and did a lot of stuff and I did figure out how it works. So let's just dive right in and do this We're gonna create a new project Flutter I Should know you should probably always do flutter doctor. I've done it like four times today, but So let's call this Flutter Google Because we're gonna do a flutter Google blog in And we're going to just hit finish and it will calculate the trajectory of everything in the known universe And here we go first thing I'm going to do is get rid of all this gobbly-gook and Use the skeleton that I like working with And then we're just gonna run this just to make sure our base application runs out of the box I should know I'm doing a different video recorder to I'm using OBS instead of Kazam. So If the video seems a little different, let me know if you like it or hate it I'm still getting a little used to this recorder. It's got some hot keys. I keep hitting them accidentally. So alright We verified flutter works IntelliJ works our emulator works our code on the emulator works. Let's dive into actual packages here Reading Firebase off the first thing you need to do is Well, you got to get the Google sign-in plug-in which we've already got here This has some steps in it, which are a little confusing to folks And I think it's this in a combination with the setup Following here that kind of messes this thing up So there is a Google sign-in Instructions and if you click that it just literally takes you to the other page that I have here So we're just gonna jump over here This is a flutter plug-in for Google sign-in blah blah blah much of stuff. We're not gonna read Let's just go here and grab our dependencies Let's jump into our Pupspec.yml. I hate this thing. I don't know why that just won't die a slow death All right, so let's go into Pupspec.yml grab that Add that in there Save it do a package as git Might as well just kill that on the emulator Now we're not done. This is where things get a little confusing. We've got some extra work to do we need to actually Go to the readme file and read some stuff iOS has some configuration stuff It's got some usage and what it's saying for Android is that you have to register your application What does that really mean? What does that really entail? So let's look at this course It takes us to Firebase, which is where I started down that whole route. So let's jump into Firebase First thing it wants to do is say hey Let's do something. So I'm going to add an Android application And it wants us to register the app So it needs a package name a nickname and debug signing with sha1 and let's just dive in here So package name It wants to get that out of the app level build gradle file. So let's go in here bang Bang notice how there's two build gradles that gets confusing. This is the project build gradle This is the app because it's in the app folder We're gonna crack that bad boy open and we want the application ID this guy right here com.example.flutter.google Let's jump back to Firebase and we're just gonna paste that in there We want a nickname. We're just gonna give it that right there This part will just straight out piss you off Debug signing certificate. It's actually required for this tutorial How do you get it? If you do this and you right-click and open a new tab and see this page You need something called the key tool and it even gives you a nifty little Blur up here and you're gonna get what's called a sha1 or SHA sha1 fingerprint So let's just crank open our terminal Make sure you have key tool installed if you don't you don't have Java installed So that was my first issue because this was a brand new Linux installation I completely blew away my desktop and none of this stuff existed so Make sure you have key tool installed otherwise do a Java version and You should see you have a Java version Paste in what they tell you to and bump you get an error message. So we have to fix this It's saying you can't do multiple commands at once after some exhaustive creative googling I found out you can just simply delete that little bit about export cert and it wants a password boom There is our fingerprints notice. It's giving us a sha1 and a sha256. We want the sha1. So let's just grab that Copy that bad boy Go back in here and paste it in In case you're a wannabe hacker. No, there's no secret sauce to that It's just the key tool on my local box, which I'm going to generate a new key tool after this video. So Have fun using it. I don't care Register the app. This is where things actually get kind of interesting So we click register and it wants us to download this jison file Why do I say jison json file? That's the Canadian in me jison It's like saying foot instead of foot you Canadians know what I'm talking about, but I'm actually American my family's from Canada So let's download this jason file. I know I'm gonna get hate mail Everybody in Canada is gonna be like we don't say Jason. We say Jason. Anyways show it folder We're gonna grab this and just copy it In case you're really morbidly curious and want to know what's in there We can take a quick peek, but we need to put it in a specific location Notice how we go into the app folder and this is the confusing bit because this is not a flutter That's an Android project. So you'll see a lot of stuff missing there Let's go in here We're in our Android folder. We want to go into app and we want to paste this It's gonna say sure you're gonna say yes And here's the jason file in all its glory. This is specific to your application and your Firebase installation Every application will have their own little jason file That's what I love about Android versus iOS development for this is because it streamlines all of this You don't have to put any of this nonsense in it just generates a file and you're good to go now Boom, this is the confusing part We have to add some stuff to our gradle. All right, so add the Firebase SDK We're just going to click that and this says do it in the project build gradle So we'll go in here. We'll go into our build on the project side of things Probably want to expand that out for this and we're just gonna add in our dependencies Give that a good save Flip back into here now. We need to go into the app level build gradle. So we're gonna copy that And I've got too many windows open back up to here And it's at the very bottom bang Just gonna compile firebase core Then we need to apply a plugin of the Google services the GMS Copy that and it says just added in the bottom. So we'll do that. It's going to apply the plugin That part is pretty simple Next we need to run the app and verify the installation Notice how it says checking to see if the app's communicated with the server So we're going to actually build this bad boy save our work run it out on the emulator and We're just gonna pull this emulator up Maybe if I can find it. I've got too many windows open bear with me bear with me. There it is This part takes a little bit and you'll notice when it does eventually come up That it even takes a few seconds longer after the application comes up Let me actually flip back over here because it's still building Okay, so the apps up and it's still thinking so our apps running and it's still doing stuff on the back end with firebase Now I think this is just pure latency on firebase's side. There's some Verification checks going on making sure the app was actually valid and then the database stores it internally replicates out and then it updates Ajax to the web page. So we're just going to sit here until this thing 100% says it is working There we go. Congratulations. You've successfully added you've apt to the firebase. So we're gonna hit continue All right So far that was pretty painless. We have Google sign-in and if we wanted to We could actually go in here and go to this example paste this code in and ta-da. It would just work However, we don't want just Google sign-in. We want firebase authentication. There's a difference here Google sign-in allows you to sign in using Google services Google services are different than firebase when you look at firebase. Where's my firebase? There it is And you look at authentication You should see user identifications in here That's separate. You can use Google sign-in without using firebase So what this does is it adds a layer when I say this I mean this guy right here Adds a layer on top of Google sign-in that allows you to use it through firebase You can do the same thing with Twitter Facebook and all this other stuff. It uses their underlying Channels to communicate and to authenticate and then it just simply updates the firebase database This is also where we start getting into trouble. So we're going to grab this and Let's go to our pubspec.yaml Throw this out here bang Do a good packages git I actually want to stop that And of course we are not done with the installation. So Let's just throw this import out here Just so our program knows if we're using it even though we're not using it yet and go back to our readme file so It says Configure the Google sign-in which we've already done Import the plug-in which we did now we need to actually add some dependencies here in our project level build gradle So let's just grab these go to our project level build gradle Here's our dependencies And we're just going to paste those in right about now somebody is screaming at their monitor to Comment out or delete these we're just going to leave it for now and let the program figure out what it needs save that and Notice at the bottom of the app level. We're going to apply this plug-in We've already done that. So just for verification that it's the same darn thing We're going to just comment this out. You can see it's the com Google gms Google services plug-in. So we don't want to do that twice This is why and let me just Flutter off Google sign in there we go This is where I started getting into trouble here when I was doing the flutter advanced tutorial This is where things just deteriorated if we save this and Just try to give this a good build and run It completely died on me. Yep. See plaa It says minimum supported gradle versions 4.4 current versions 4.1 Luckily for us it gives us how to fix this bad boy so let's go in here and It says go into this specific file Android gradle wrapper gradle properties dot to 4 for all This is the confusing bit if you're in the actual editor and you want to go into Android gradle You see there's no wrapper folder and you're like where'd it go? So Let's bring up this Good code flutter What are we in flutter Google? Android gradle Suddenly there's a wrapper folder. So the IDE tricks us and hides it from us shame on you IDE Let's go ahead and open this up in a text editor and you can see here Is the offending line gradle 4 1 and it's requiring 4 4 so we're gonna say 4 4 all save that now run this again and If I remember correctly we get an entirely different error message Which just will infuriate you and you'll pick up your keyboard and chuck it across the room or just ninja punch it Yeah, okay. Here we go So let's expand this out What went wrong failed to notify dependency resolution listener Huh English? What does that mean the library blah blah blah play services? You remember that guy we did in the end of our file there is being requested by various other libraries at This level here 1504 1504 but resolves to 1502 I Googled the heck out of that and could not figure out how to upgrade that turns out you don't really need to So let's play around with this bad boy here Let's go here And let's go to the very end here. I actually did post it So we're gonna look at our dependencies here and we're gonna look at that gms services for zero Right here simply commenting out this fixes the issue How did I find that out dumb luck? I just started commenting out things to see where it started working So let's bring up our emulator here And we are going to just run this bad boy just to see if we can get a solid build out of this and This may take a second because it's pulling all that stuff in and compiling it My chair is getting squeaky. That's gonna get annoying We got some notes. We're just gonna ignore that and should install the APK which means it built and boom There's our program. So let's actually get Google sign in working Okay, let's go here and I'm going to cheat and I'm just gonna do the example I don't like doing this because you have to really pick apart somebody else's coding style and figure out what the heck's going on But I just want to make sure this thing works. So we're gonna completely blow away my code save this Hot reload is going to of course die and we're just going to restart this whole thing from scratch and see if it works What we should have when this thing is done is a nice interface that allows to do Google sign in through firebase and still update the firebase back end Alright, so we're going to test sign in with Google And it says choose an account void room 0 5. That's my dummy account Don't ever email me because I'll never answer you and we've successfully signed in Boom sign in with Google succeeded. Let's check our firebase back in and see what it actually looks like here And this is the part that's got me a little dumbfounded. It doesn't actually show Well, there it is. Yep Void room 0 5 a Gmail. So now we have our user ID on our firebase back in With our Google provider and everything is working as expected and we can copy the UID and all that stuff. So I'm sorry. There wasn't a whole lot of typing in here But this is actually taking me about a week to really figure out why none of this crap was working And I've been going back and forth on the github page trying to figure it out So that is how everything works. So if you've at this point and you're really stuck the big thing to really take away here is Whoopsie Where'd I do it? Where'd I do it? I? Just screwed that all up didn't I am in the wrong file, aren't I? Boom here it is in the project level build Gradle. Just comment out that services for oh Make sure you're doing the Gradle 4 for all in the specific Gradle wrapper or properties file And then it should just work assuming you have set up the project correctly The other big takeaway from this is if you skip that step with Your application setup and you didn't put in a shaw one because you didn't want to screw around the key tool or any of that This will not work. You need that shaw one in your application That's it. Thank you guys for watching. Thank you for being very patient with me as I'm still grinding away with videos I know I have a post in anything in void realms in a while. So I wanted to throw this out here first This is going to be part of a larger thing in the Udemy tutorials I'm going to make I should say I'm in the process of making flutter advanced. There's gonna be six sections and I'm on section five right now, which is intro to firebase, which is gonna cover a lot of what we just talked about and Then section six is going to be like firebase storage and firebase to real-time database how to get information up in there and back and forth So thank you guys for watching and I'll talk to you later