WEBVTT 00:00.020 --> 00:08.900 Hey, guys, I think we can begin by creating the authentication controller login form action that will 00:08.900 --> 00:10.910 display the login form. 00:11.000 --> 00:18.320 It's essential that we have a form that we can submit to test all the other functionalities. 00:19.340 --> 00:21.080 So let me jump to the code editor. 00:21.080 --> 00:28.820 And before we actually begin, I wanted to remove this excessive header that we have in the home index 00:28.820 --> 00:29.660 template. 00:30.410 --> 00:34.670 It seems to be taking too much space without any reason. 00:35.030 --> 00:40.700 And remove this header from the index file in the post folder. 00:40.730 --> 00:43.310 Okay, so a tiny cleanup. 00:43.520 --> 00:47.390 Now let's just go ahead and create the controller. 00:47.420 --> 00:51.200 It can be called an auth controller. 00:52.340 --> 01:00.020 So we add the PHP tag and we define the namespace which is app controllers. 01:00.020 --> 01:03.350 And the class is auth controller. 01:05.050 --> 01:07.210 Now let me add the actions. 01:07.210 --> 01:11.020 The first one I'm going to call it create. 01:11.050 --> 01:13.960 This action will just display the form. 01:16.270 --> 01:19.660 And another one I'm going to call it store. 01:20.380 --> 01:24.700 And it will be responsible for handling the form submission. 01:25.120 --> 01:29.710 Now the names I have given to those actions are not accidental. 01:30.220 --> 01:34.780 That's the notation you're going to see in the Laravel framework. 01:35.320 --> 01:38.590 So the action that renders the form is typically called create. 01:39.340 --> 01:44.140 And the action that handles the form submission is called store. 01:45.820 --> 01:49.540 So in this video we are working on that one. 01:49.540 --> 01:53.770 So our job is just to render the form. 01:54.550 --> 01:58.180 Let's use our view class for that. 01:58.240 --> 02:03.880 Render method and start with the template. 02:04.270 --> 02:19.140 So this could be our create Our layout is layouts main, and I don't think we need any data in here. 02:19.950 --> 02:25.410 Now let's jump to the views and create the missing folder. 02:26.250 --> 02:30.690 So this will be auf and the template name. 02:30.690 --> 02:33.150 It is create. 02:35.280 --> 02:35.640 PHP. 02:37.620 --> 02:39.390 Let's start with a header. 02:39.420 --> 02:41.310 Let's just say login. 02:42.540 --> 02:45.300 And then we're just going to add a form. 02:46.200 --> 02:48.210 So we need the URL. 02:48.240 --> 02:54.990 I think this auth controller can lead to the login page. 02:56.670 --> 02:59.700 And the method here has to be post. 03:00.240 --> 03:01.740 So why it has to be post. 03:01.740 --> 03:11.130 Well if the method would be get, then the username and password will be sent as the URL query parameters, 03:11.790 --> 03:16.220 which means they will be stored in the browser history. 03:17.060 --> 03:19.250 So that's obviously a no no. 03:19.250 --> 03:22.970 It needs to be sent through the post method. 03:23.180 --> 03:29.930 So I think that we don't have here but we're going to add later are the CSRF tokens. 03:29.960 --> 03:33.170 So let's begin by adding the inputs. 03:33.170 --> 03:35.420 So we need a label. 03:36.500 --> 03:38.600 Let it be email. 03:39.500 --> 03:47.090 And also I'm going to add the for attribute for the email field so that it can be activated when you 03:47.120 --> 03:48.560 click on the label. 03:48.590 --> 03:51.410 The type is email. 03:52.760 --> 03:58.010 Now I need to give an ID so that this for attribute can find the input. 03:58.700 --> 04:03.650 And the name of it is also email and it's required. 04:04.040 --> 04:07.970 Now I'm going to quickly copy and paste that to add another one. 04:08.270 --> 04:09.620 That's password. 04:11.720 --> 04:15.560 And here we can use the type password. 04:15.590 --> 04:17.120 There is a type like that. 04:17.150 --> 04:19.970 The ID is also password. 04:20.810 --> 04:25.220 The name is also password and it's also required. 04:27.590 --> 04:28.880 So we had those two inputs. 04:28.880 --> 04:33.440 And then we're just going to have our submit button. 04:34.490 --> 04:36.500 So the type is submit by default. 04:36.500 --> 04:38.930 But we can be explicit in this case. 04:39.260 --> 04:41.570 Let's just say login. 04:41.570 --> 04:44.480 So there are a couple of features that we don't have here. 04:44.480 --> 04:47.930 So we don't display any kind of errors. 04:47.960 --> 04:50.510 We don't have the CSRF token. 04:50.900 --> 04:59.300 And here in the future we might have a Remember Me feature. 04:59.510 --> 05:01.580 That would be just a check box. 05:01.580 --> 05:12.290 And if someone would check this check box, we're going to try to remember them being sign in for, 05:12.320 --> 05:13.790 let's say two weeks. 05:16.370 --> 05:20.090 So we can verify if this page gets displayed properly. 05:20.110 --> 05:22.570 But first we need to add a route. 05:24.370 --> 05:27.310 So let me copy and paste it for it to be quicker. 05:27.310 --> 05:33.700 And I said we're going to use this path to display the auth controller. 05:35.020 --> 05:39.370 So this is the auth controller create. 05:39.400 --> 05:40.900 That's a form. 05:42.790 --> 05:49.390 The same URL will be used but with a different method to handle the form submission. 05:49.450 --> 05:55.090 And later on we might have one more connected to the auth controller. 05:55.300 --> 05:58.840 This might be just a logout action. 05:59.260 --> 06:03.280 For now, let's just check if this works. 06:03.280 --> 06:05.410 So let me jump to the auth controller. 06:05.710 --> 06:12.940 And here let me just die with some message like form sent. 06:16.060 --> 06:23.710 Next up, let's just jump to the browser and see if we can submit the form and receive the data inside 06:23.710 --> 06:24.150 the store. 06:24.150 --> 06:24.990 Action. 06:25.350 --> 06:31.620 I might also do var dump with the post data first. 06:34.170 --> 06:39.240 Okay, so let me type an email because we need to type something to those fields. 06:39.240 --> 06:46.860 By adding this required attribute, we just make them forcing the user to type something. 06:47.040 --> 06:54.750 Now as you see, this input of type password by default is hiding the typed password. 06:55.410 --> 07:03.810 So now I hit login, I see the submitted data and the text form sent, which just confirms that our 07:03.810 --> 07:06.420 setup works perfectly fine. 07:07.260 --> 07:13.800 And the logic that handles this form submission is actually authenticating the user. 07:14.700 --> 07:17.400 This would take a little bit more time. 07:17.400 --> 07:20.730 So for now let's just wrap up this video. 07:20.760 --> 07:27.720 Next up we'll be working on this form submission logic trying to authenticate the user.