WEBVTT 00:04.150 --> 00:05.230 Hey, did everyone they. 00:05.230 --> 00:05.530 Sure. 00:05.530 --> 00:10.000 And in this video, we're going to just create a basic project, initialize it with, install some of 00:10.000 --> 00:13.150 the libraries, some of the one which we are familiar with that quite a lot. 00:13.150 --> 00:18.280 Some is going to be new, obviously, and after that we are going to just create some models and everything. 00:18.280 --> 00:19.720 So what is the whole idea? 00:19.720 --> 00:23.440 The goal is we want to have a button which say simply Google login. 00:23.440 --> 00:27.640 As soon as somebody clicks on it, we'll show the consent screen as soon as it gives us the permission 00:27.640 --> 00:31.270 that I want to log in with this Google account, then we're going to come back. 00:31.270 --> 00:36.010 We'll extract the email of the username, we'll store in the database, and there comes the problem. 00:36.010 --> 00:40.810 We want to actually code the flow in such a way that if the user already exists in our database, then 00:40.810 --> 00:42.880 we want to just go ahead and say, Hey, you log in. 00:42.880 --> 00:48.130 If he doesn't exist, we create a new entry in the database and we allow him to just log in. 00:48.130 --> 00:52.960 And there comes the issue that when can we actually assign some of the tokens or we can go with the 00:52.960 --> 00:54.730 password way, a whole lot of things. 00:54.730 --> 00:58.840 So I hope I have given you the brief enough overview of how the application is going to work on. 00:58.840 --> 01:00.040 Let's go ahead and move on. 01:00.160 --> 01:02.500 So I'll go into our AE back end. 01:02.500 --> 01:07.090 There we are creating all of our application and stuff, so let's go ahead and create a new directory 01:07.150 --> 01:14.020 and we are going to call this one as simply AE Passport Google. 01:14.020 --> 01:18.040 So a kind of a weird name, but this is what we are going to go with that. 01:18.040 --> 01:19.900 So let's go ahead and move into this one. 01:19.900 --> 01:24.250 So this one is AE Passport Google. 01:24.940 --> 01:30.550 Now, once I'm inside this one, I'm going to go ahead and create NPM in it and we are going to use 01:30.550 --> 01:35.140 a dash Y option to just have the all the files being created for this one. 01:35.230 --> 01:38.410 If I go quick Ellis package, the JSON is available for me now. 01:38.410 --> 01:40.210 Let's go ahead and install a few packages. 01:40.210 --> 01:44.020 So we're going to go ahead and say, hey, I want to install Express. 01:44.020 --> 01:45.910 We are quite familiar with the Express. 01:45.910 --> 01:47.650 We have done extensively with that. 01:47.740 --> 01:49.870 We have also touched a little bit of edges. 01:49.870 --> 01:50.890 We are going to use that. 01:50.890 --> 01:55.090 No, this is not a dedicated tutorial on just building the entire application with Node. 01:55.090 --> 01:56.950 This is moreover a just backend. 01:56.950 --> 02:01.240 So we'll be just taking a bare minimum of edges, not conditional rendering and everything. 02:01.240 --> 02:02.860 So we are going to just go stay there. 02:02.980 --> 02:04.690 Now we're going to be touching the database. 02:04.690 --> 02:09.310 So we already know that Mongoose is the guy who is going to do the job. 02:09.310 --> 02:12.190 Now, another library that we are going to use is passport. 02:12.190 --> 02:17.080 And since we are actually working on the strategy of the Google itself, so if I click on The View all 02:17.080 --> 02:24.760 strategies and I type in for Google or to it requires me another of the package which says a passport 02:24.760 --> 02:25.540 dash. 02:25.630 --> 02:29.350 In fact, I can copy this passport dash, Google dash. 02:30.090 --> 02:30.730 Or what? 02:30.750 --> 02:31.690 Two zero. 02:31.710 --> 02:33.820 So that is the one that we are going to need. 02:33.840 --> 02:35.580 So password is the code package. 02:35.580 --> 02:39.390 You are going to 100% need that with whatever the strategy you are implementing. 02:39.390 --> 02:42.060 And after that you can say that what kind of strategy are bringing in? 02:42.090 --> 02:45.900 If you are bringing in Facebook and everything, then after password go ahead and install all those 02:45.900 --> 02:46.380 one. 02:46.380 --> 02:51.780 Now there is one more new one here which is going to be simply cookie and this is all one word. 02:51.780 --> 02:53.310 See is hiding there. 02:53.310 --> 02:56.100 If I can just extend this, will it make sense? 02:57.480 --> 02:57.900 Yeah. 02:58.410 --> 03:01.410 So this one is cookie dash session. 03:01.560 --> 03:03.930 Now why we are having this cookie session. 03:03.930 --> 03:04.980 We haven't worked. 03:05.010 --> 03:07.830 Hey, come on, cookie does session. 03:08.220 --> 03:09.960 So why we are using cookie session? 03:09.960 --> 03:13.050 In the previous of the application, we never installed any kind of these things. 03:13.050 --> 03:14.940 We actually work directly with the Express. 03:14.940 --> 03:16.230 Yes, I'm aware of that. 03:16.230 --> 03:18.960 But notice here we are not having the JSON web token. 03:18.960 --> 03:21.180 So JWT are not coming in yet. 03:21.180 --> 03:24.600 We will have the JWT, right, thanks to the password itself. 03:24.600 --> 03:27.390 So let me first go ahead and install all of these ones. 03:28.020 --> 03:28.320 Okay. 03:28.320 --> 03:29.520 So that was really quick. 03:29.520 --> 03:33.810 All of them got installed, but now I have got one more to install, so I'm going to go ahead and remove 03:33.810 --> 03:34.680 all of this. 03:34.680 --> 03:39.740 In fact, I'm going to say Dash DX and again, our favorite trusty node man. 03:39.990 --> 03:44.250 So these are the all ones that we got as the basic ones, hopefully. 03:44.460 --> 03:46.320 And let's go ahead and fire up the code later. 03:46.380 --> 03:50.280 So we're going to say code and dot and hopefully they should fire up my VSE code. 03:51.240 --> 03:53.070 Yes, of course I do trust it. 03:53.900 --> 03:54.200 Okay. 03:54.200 --> 03:58.220 So this is the basic let me let me expand this all the way up here. 03:58.700 --> 03:59.240 There we go. 03:59.240 --> 04:00.170 Nice and easy. 04:00.170 --> 04:02.030 This can go a little bit extended. 04:02.030 --> 04:02.690 There we go. 04:03.530 --> 04:06.350 Okay, so first thing, let's check out the package that Jason. 04:06.380 --> 04:09.410 Everything is installed is looking fine and we are having indexed. 04:09.740 --> 04:16.420 So let's go ahead and say this is going to be a start and this one is going to simply say node indexed 04:16.430 --> 04:21.170 or JS and let's copy this and have the dev also. 04:21.170 --> 04:22.760 So we're going to go ahead and save. 04:24.000 --> 04:25.230 Node, Mom. 04:25.230 --> 04:25.990 And there we go. 04:26.010 --> 04:29.970 Now all we need is a new file which is going to be indexed or JS. 04:31.780 --> 04:32.500 There we go. 04:33.010 --> 04:35.640 So the basics of all the application is all done. 04:35.650 --> 04:39.580 Now, the very first thing that we are going to do is create the model that is going to be like a really 04:39.580 --> 04:40.510 super small video. 04:40.510 --> 04:44.260 So let's go ahead and catch up in the next video and create a model for the user.