1
00:00:05,060 --> 00:00:06,550
Everyone welcome back.

2
00:00:06,620 --> 00:00:11,840
Johnny B here with slopes not come and in this lesson we're going to take a look at the Google log in

3
00:00:11,840 --> 00:00:13,040
process.

4
00:00:13,040 --> 00:00:19,580
So with each of the social platforms that we're going to look at Google Facebook and Twitter.

5
00:00:19,850 --> 00:00:21,540
The process is very similar.

6
00:00:21,650 --> 00:00:24,160
All right so it's twofold for each of them.

7
00:00:24,230 --> 00:00:32,030
First we are going to be working with the social platforms SDK whether it's Google Facebook or Twitter.

8
00:00:32,270 --> 00:00:38,750
And what we're going to be doing is we are going to use their the case to basically log in and return

9
00:00:38,870 --> 00:00:41,000
and authentication credentials.

10
00:00:41,270 --> 00:00:41,710
All right.

11
00:00:41,780 --> 00:00:47,990
At that point then we move over to the firebase side where we take that authentication credential and

12
00:00:47,990 --> 00:00:55,480
we pass it into the firebase auth function and from there we're able to actually create a firebase user.

13
00:00:55,480 --> 00:00:55,730
All right.

14
00:00:55,760 --> 00:01:03,200
So that's kind of the the flow for each platform we use we use the platform STK to log in and return

15
00:01:03,230 --> 00:01:04,560
and credential.

16
00:01:04,670 --> 00:01:09,890
Then we take that credential we pass it into fire bases methods and we create a new user.

17
00:01:10,100 --> 00:01:15,220
All right so they're actually kind of completely separate like we could just do a Google logon.

18
00:01:15,320 --> 00:01:22,370
But if we want to use Google or Facebook to log in and get a firebase user then we have to add on that

19
00:01:22,370 --> 00:01:26,780
second part using firebase which is to pass the credential to firebase.

20
00:01:26,900 --> 00:01:28,480
So anyways let's let's get started.

21
00:01:28,480 --> 00:01:34,670
We're going to work with Google first and what we're going to do is let's go ahead and we are going

22
00:01:34,670 --> 00:01:42,170
to just do a search for firebase Google logon and you can find this documentation here authenticate

23
00:01:42,170 --> 00:01:49,730
using Google sign in on iOS and we're going to loosely follow this documentation here.

24
00:01:49,760 --> 00:01:55,850
I'm not going to follow it step by step because in my opinion it's not in the most natural order.

25
00:01:55,990 --> 00:02:01,340
But yes we're going to just so you know where to go if you get stuck or if you need further documentation

26
00:02:01,340 --> 00:02:02,020
help.

27
00:02:02,260 --> 00:02:10,340
So the first thing we are going to do is we are going to add to this or else scheme here and get services

28
00:02:10,700 --> 00:02:17,270
that we need to add a your L scheme with the reversed claimed ID key that we get in our Google service

29
00:02:17,270 --> 00:02:18,540
info it up the list.

30
00:02:18,560 --> 00:02:24,170
So if we jump back into X code and the one that we need right here Google service and fold up the list

31
00:02:24,530 --> 00:02:30,470
and this guy right he reversed client id getting going to grab this and copy it and then we're going

32
00:02:30,470 --> 00:02:37,640
to Slik our firebase target here and we're going to go into info and then we're going to go to your

33
00:02:37,640 --> 00:02:44,450
L types and we are going to add a new U R L type and here for the U or L scheme we are just going to

34
00:02:44,540 --> 00:02:51,350
paste what we copied from our info from our Google service info up list.

35
00:02:51,380 --> 00:02:52,730
Okay that's good.

36
00:02:52,730 --> 00:02:57,410
I'm going to save that for each and every one of these platforms.

37
00:02:57,470 --> 00:03:02,630
It's just going to be a lot of procedure and steps that we just got to do to make it work.

38
00:03:02,630 --> 00:03:03,140
All right.

39
00:03:03,350 --> 00:03:04,460
So this is step one.

40
00:03:04,460 --> 00:03:06,260
Adding are your L scheme.

41
00:03:06,260 --> 00:03:12,560
Next up we're going to go into our app delegate and I'm going to delete all these methods that we're

42
00:03:12,560 --> 00:03:16,590
not going to be using just to clean things up a little bit.

43
00:03:17,180 --> 00:03:24,380
And here I'm going to import both firebase and G.

44
00:03:24,440 --> 00:03:26,350
D Google Science and that's it.

45
00:03:26,390 --> 00:03:35,030
All right and so the app delegate We need to conform to the G Id sign and delegate right here.

46
00:03:35,380 --> 00:03:35,930
OK.

47
00:03:36,110 --> 00:03:40,520
And that's going to tell us that we need to implement some methods.

48
00:03:40,520 --> 00:03:47,510
So I'm going to say fix and it's going to add in this method right here I'm going to cut and paste it

49
00:03:47,510 --> 00:03:48,950
down here.

50
00:03:48,950 --> 00:03:49,790
All right.

51
00:03:49,790 --> 00:03:55,240
It's going to move that would go and looks pretty good.

52
00:03:55,250 --> 00:04:02,040
So this is the method that is called Once we have signed in using Google and we get the parameters error

53
00:04:02,180 --> 00:04:05,790
and yes so let's go ahead and do a check on that.

54
00:04:05,790 --> 00:04:15,320
We're going to if that error is equal to error then we're going to say we're going to debug print debug

55
00:04:15,440 --> 00:04:25,730
print and we're going to say could not log in with Google and then we're going to just print out that

56
00:04:25,790 --> 00:04:26,250
error

57
00:04:29,500 --> 00:04:32,550
else.

58
00:04:32,720 --> 00:04:34,710
We're just going to print out for now.

59
00:04:38,650 --> 00:04:39,610
Logged in.

60
00:04:40,060 --> 00:04:40,310
OK.

61
00:04:40,320 --> 00:04:45,460
And then here in the did finish launching with options we need to initialize our firebase app.

62
00:04:45,470 --> 00:04:55,310
So when I say firebase app that configure and then we need to set a couple of Google seinen variables.

63
00:04:55,420 --> 00:05:03,490
When I say a G Id sign in that shared instance or this is the shared instance for the Google sign in

64
00:05:03,490 --> 00:05:10,510
class and I'm going to say Dot client id and we are going to set that equal to our firebase app that

65
00:05:10,900 --> 00:05:23,140
app that options that client id then we're going to say Gee Id seinen that shared instance that delegate

66
00:05:23,530 --> 00:05:25,340
is equal to self.

67
00:05:25,560 --> 00:05:33,000
So now that we have set the same delegate here conform to its methods and added our delegate and Client

68
00:05:33,010 --> 00:05:34,220
ID here.

69
00:05:34,420 --> 00:05:40,090
Now we're going to move over to our view controller does swift file and we are going to add a Google

70
00:05:40,090 --> 00:05:41,080
sign in button.

71
00:05:41,080 --> 00:05:41,440
All right.

72
00:05:41,620 --> 00:05:48,350
So if we check out our documentation here we have gone through this here we've done through Step 1 here.

73
00:05:48,490 --> 00:05:53,030
We have come through Step two here where we add the sign in delegate.

74
00:05:53,240 --> 00:05:57,340
We've come through Step three here and it's here.

75
00:05:57,360 --> 00:06:03,910
We have more Skipp stuff for for now and see here.

76
00:06:04,780 --> 00:06:06,310
I think that's pretty good for now.

77
00:06:06,400 --> 00:06:08,370
We'll check back in there here in a minute.

78
00:06:08,470 --> 00:06:14,920
But first I want to add that I said Here in mind story board X I want to show you in the documentation

79
00:06:14,920 --> 00:06:17,770
what it says so says here.

80
00:06:17,790 --> 00:06:18,440
Here we go.

81
00:06:18,520 --> 00:06:24,130
Add adhd sign in button to your storyboard zip file or instantiated programmatically to add the button

82
00:06:24,130 --> 00:06:30,610
to your storyboard or zip file add a view and said It's custom class to G Id sign in button and then

83
00:06:30,610 --> 00:06:35,830
a note here says when you add the GED sign in button to your storyboard the sign in button doesn't render

84
00:06:35,830 --> 00:06:37,030
and the interface builder.

85
00:06:37,060 --> 00:06:39,500
Run the app to see the sign in button.

86
00:06:39,520 --> 00:06:47,360
All right so I wanted to show you that that is the actual way that the documentation says to do this.

87
00:06:47,410 --> 00:06:55,610
So we're going to add in a view here and I'm going to just resize it going to pinnate going to say Tony

88
00:06:55,630 --> 00:07:02,320
from the left and 20 from the top and from the right.

89
00:07:02,330 --> 00:07:10,060
And when I set the height to 40 I say add four constraints and then just so that we can see it I'm going

90
00:07:10,060 --> 00:07:16,550
to set the background to a light gray color and that won't show up when we run this.

91
00:07:17,050 --> 00:07:22,520
So I'm going to select it again and set the class to G Id sign in.

92
00:07:22,540 --> 00:07:23,980
And there we go.

93
00:07:24,040 --> 00:07:29,410
And now let's go ahead and open up our assistant editor with our view controller so that we can add

94
00:07:29,410 --> 00:07:32,350
an action for this view.

95
00:07:32,710 --> 00:07:37,520
So right here interview did load into control and drag from our view.

96
00:07:37,760 --> 00:07:40,210
And I'm going to call this and it changes to an action.

97
00:07:40,220 --> 00:07:45,720
Want to call this Google sign tapped.

98
00:07:46,320 --> 00:07:52,380
And we're going to say connect and then we're going to close it and jump back into our control adults

99
00:07:52,420 --> 00:07:53,600
with file.

100
00:07:53,610 --> 00:07:58,980
And here in the Google sign in tapped I'm going to say Oh well first we import we got to import Let's

101
00:07:58,980 --> 00:08:04,600
go import firebase and Google sign it.

102
00:08:04,890 --> 00:08:11,790
And here in our view control the protocol that we want to add is Je Id sign and you don't get in here

103
00:08:11,790 --> 00:08:21,240
in our view though we will set the ID sign in that shared instance that you Idella get equal to self.

104
00:08:21,460 --> 00:08:21,770
OK.

105
00:08:21,780 --> 00:08:32,940
And now last step is Id sign in that shared instance that sign in and we were going to do is launch

106
00:08:32,940 --> 00:08:35,550
the Google logon screen.

107
00:08:35,550 --> 00:08:39,050
All right so let's go and test this out.

108
00:08:39,060 --> 00:08:42,140
All right so here is that Id sign in button.

109
00:08:42,360 --> 00:08:47,910
And so this is kind of the default button that you can use out of the box for Google sign in.

110
00:08:48,060 --> 00:08:50,300
And if we click on it lets see what happens.

111
00:08:51,160 --> 00:08:53,730
All right so this is we want to use Google dot com to sign in.

112
00:08:53,730 --> 00:08:55,800
We cannot continue and allow it.

113
00:08:55,860 --> 00:09:02,150
And then this pops up and we were able to choose an account to log into and I'm going to pick my Johnny

114
00:09:02,180 --> 00:09:05,550
Depp's up one and look at that.

115
00:09:05,550 --> 00:09:07,990
If you see down here it says logged in.

116
00:09:08,010 --> 00:09:12,410
All right so that is being called here from the app delegate if you remember from the did sign in for

117
00:09:12,420 --> 00:09:13,230
user.

118
00:09:13,500 --> 00:09:16,400
So we are successfully logging in with Google.

119
00:09:16,560 --> 00:09:18,300
So I was pretty dang cool.

120
00:09:18,420 --> 00:09:24,000
So I think were going to finish up here with this lesson and in the next lesson we are going to actually

121
00:09:24,000 --> 00:09:30,120
integrate this with firebase so that we can use what we've got here so far logging in with Google to

122
00:09:30,120 --> 00:09:36,950
actually log in with firebase and create users the firebase database with this Google log and are all

123
00:09:37,010 --> 00:09:38,110
seeing the next one.