1 00:00:00,210 --> 00:00:06,660 And once we're done, setting up our configuration essentially wants our front end application is running 2 00:00:06,660 --> 00:00:11,430 the back, an application is running, we have the proxy and we use concurrently. 3 00:00:11,760 --> 00:00:14,100 Now we can start finally setting up the logic. 4 00:00:14,640 --> 00:00:21,420 So yes, I know we spent quite a long time on setting up the proxy and kind of progression, but it 5 00:00:21,420 --> 00:00:27,390 was very important for me to showcase all the steps in detail because I know that I'm going to be getting 6 00:00:27,390 --> 00:00:30,450 those questions at the end of the day and of course, Q&A anyway. 7 00:00:31,290 --> 00:00:37,380 So I might as well cover that during the video because in the video, I can give you a visual representation. 8 00:00:37,710 --> 00:00:43,770 So there was a small detour, but now we're back on track and the way it's going to work, we will set 9 00:00:43,770 --> 00:00:47,370 up some logic on the back backend, which we already have for it is there. 10 00:00:47,580 --> 00:00:49,170 So that's going to be the first thing we're set up. 11 00:00:49,590 --> 00:00:53,030 And then we implement the logic on the frontend. 12 00:00:53,490 --> 00:00:59,280 So set up the controller, then handle that on the front, then set up the controller, handle that 13 00:00:59,490 --> 00:01:02,490 on the front and then hopefully you know where I'm going with this. 14 00:01:02,850 --> 00:01:06,750 Now, when it comes to register, it's actually very similar to a logging. 15 00:01:07,650 --> 00:01:14,160 And therefore, in order to show all the steps, I'll use log-in functionality from the complete project. 16 00:01:14,730 --> 00:01:20,460 So that way you can clearly see because there's no point for me to register a new user again, they're 17 00:01:20,460 --> 00:01:27,450 going to be very, very similar and the steps are falling where we want to provide the values, then 18 00:01:27,450 --> 00:01:34,020 we'll invoke the request in this case to any longer than once the data comes back. 19 00:01:34,620 --> 00:01:41,040 We'll set up the user token, the location in the components, and we'll also do that in a local storage. 20 00:01:41,670 --> 00:01:42,780 So these are two steps. 21 00:01:43,080 --> 00:01:47,130 And just to showcase how everything is going to look in the complete project, we're going to go here 22 00:01:47,130 --> 00:01:51,330 with my dummy one and then I will provide the evaluation. 23 00:01:51,930 --> 00:01:55,830 And once we click on Submit, we'll make a log and request. 24 00:01:56,490 --> 00:02:04,980 And then if we're successful, we will direct the user towards the dashboard so programmatically navigate 25 00:02:04,980 --> 00:02:06,990 them to the dashboard page. 26 00:02:07,650 --> 00:02:14,370 And then when it comes to components, you'll notice that I will have my user token and location. 27 00:02:15,030 --> 00:02:16,620 So let me make this one bigger. 28 00:02:16,770 --> 00:02:22,050 And then once I scroll down notice, I'm going to have the info about the user that we're sending back, 29 00:02:22,380 --> 00:02:26,010 whether that is an email, the last name and, you know, the rest. 30 00:02:26,250 --> 00:02:28,920 And also, we have user location. 31 00:02:29,890 --> 00:02:31,240 And then we have the token. 32 00:02:31,720 --> 00:02:39,580 So all of these three factors and also we set them up in our local storage because when I refreshed 33 00:02:39,580 --> 00:02:45,070 the page, I actually wanted to purchase them since when it comes to state, they're not going to be 34 00:02:45,070 --> 00:02:45,610 persistent. 35 00:02:45,910 --> 00:02:54,460 Now we do have the logic there in the app context, where every time we refresh the page, we will reset 36 00:02:54,460 --> 00:02:58,120 them will basically grab them from the local storage. 37 00:02:58,450 --> 00:03:04,150 But if, for example, I go here and I clean it out now, at the moment I will refresh. 38 00:03:04,660 --> 00:03:06,400 They won't be there by default again. 39 00:03:06,700 --> 00:03:09,280 That's one of the things with state and react. 40 00:03:09,520 --> 00:03:15,430 It's not persistent between the page refreshes and once we know what we're going to be working on. 41 00:03:15,700 --> 00:03:17,320 Essentially, the enregistre controller. 42 00:03:17,650 --> 00:03:19,780 Now let's start following the steps.