1 00:00:00,610 --> 00:00:07,540 OK, so now let's go ahead and create the desserts component, which it is responsible for showing us 2 00:00:07,720 --> 00:00:10,060 the desserts inside the browser. 3 00:00:10,550 --> 00:00:16,840 Or let's go inside the components folder and here we will create the results dark G6. 4 00:00:16,960 --> 00:00:17,590 So. 5 00:00:18,670 --> 00:00:22,120 The salt or cheese or peculiar depends on you. 6 00:00:22,810 --> 00:00:26,470 So it gives you an empty file. 7 00:00:27,300 --> 00:00:32,800 So now here we will import our basic code, the boilerplate code with the. 8 00:00:34,890 --> 00:00:39,960 Our IFC, which is a relaxed, functional component within export. 9 00:00:40,680 --> 00:00:47,970 And here we will import some of the things like the use effect we'll be needing. 10 00:00:48,150 --> 00:00:50,220 So here is the use effect. 11 00:00:51,680 --> 00:00:52,670 It was a fact. 12 00:00:53,510 --> 00:01:00,350 Okay, so next, we'll import the used location from the reactor algorithms that we use. 13 00:01:02,170 --> 00:01:03,250 Location. 14 00:01:05,140 --> 00:01:13,600 From the crowd, third on next will include the the top layer now we. 15 00:01:14,780 --> 00:01:16,880 I have not yet installed the React player. 16 00:01:16,920 --> 00:01:26,540 No, let me show you what is there and why we actually need it, so we will go to our browser and now 17 00:01:26,540 --> 00:01:27,110 we'll close this. 18 00:01:27,110 --> 00:01:29,120 We don't need any more inside the NBN. 19 00:01:29,150 --> 00:01:33,500 We will see the backup player. 20 00:01:33,740 --> 00:01:35,660 I will tell you why we need it, actually. 21 00:01:36,500 --> 00:01:37,070 And. 22 00:01:38,590 --> 00:01:42,340 So this is just for playing the video. 23 00:01:42,670 --> 00:01:50,800 So as I already told you in the introduction of video that we will have the fields for the all like 24 00:01:50,800 --> 00:01:57,360 the results will be for all images, news and for the videos of other videos. 25 00:01:57,370 --> 00:01:59,420 We are going to install the three player. 26 00:01:59,830 --> 00:02:00,370 Nothing else. 27 00:02:00,940 --> 00:02:03,760 So that is all what I thought about this. 28 00:02:04,210 --> 00:02:11,320 So we will import, I will install this will copy this thing and the next we will go to our. 29 00:02:12,580 --> 00:02:20,530 Co-Director and hear inside the terminal will open our terminal by control, plus Bektic, and here 30 00:02:20,530 --> 00:02:25,570 we will go to our projects, and that is the Google search. 31 00:02:26,110 --> 00:02:33,430 And here we will paste that command and we will install this player by hitting enter on this particular 32 00:02:34,120 --> 00:02:34,600 command. 33 00:02:35,080 --> 00:02:39,730 So I have already installed the appropriate part you haven't because you're not. 34 00:02:40,630 --> 00:02:43,510 So you can just in started by this command. 35 00:02:43,990 --> 00:02:47,110 It will take just a few seconds and it will be installed. 36 00:02:47,110 --> 00:02:52,000 So once you have installed, we will come back to decoding and let me minimized the terminal. 37 00:02:52,810 --> 00:02:55,090 And now we will start. 38 00:02:57,170 --> 00:03:05,270 With the coding part, so we will import the React Player React player. 39 00:03:06,800 --> 00:03:09,680 So real clear from. 40 00:03:11,940 --> 00:03:14,720 The player, yeah. 41 00:03:15,560 --> 00:03:18,470 So next, we will. 42 00:03:20,580 --> 00:03:24,870 Our global context here, so that will be the import. 43 00:03:25,940 --> 00:03:27,650 Not just that will be the U.S. 44 00:03:28,460 --> 00:03:30,020 State context. 45 00:03:31,800 --> 00:03:32,370 From. 46 00:03:33,870 --> 00:03:42,180 Thought clash, then the context that it will be the state context for later, so this we will import 47 00:03:42,180 --> 00:03:50,460 and next we will go to the loading and we will import the loading from here that there will be the loading. 48 00:03:51,370 --> 00:03:54,190 And this we are importing from. 49 00:03:56,790 --> 00:03:58,310 Assists on the loading. 50 00:03:58,980 --> 00:03:59,460 Yes. 51 00:04:00,630 --> 00:04:06,120 So from looting, we have imported and next, now we will export. 52 00:04:07,440 --> 00:04:12,960 We don't export and basically already function inside this function. 53 00:04:13,270 --> 00:04:14,910 But this resort function? 54 00:04:15,720 --> 00:04:21,210 Now we will go and create some of the things like the contextual. 55 00:04:21,420 --> 00:04:24,150 So here we will see concert. 56 00:04:24,750 --> 00:04:32,790 And here we will see the results like whatever we are clear inside the global context. 57 00:04:33,540 --> 00:04:38,760 So it will be results and results, basically. 58 00:04:39,330 --> 00:04:42,780 Next, we'll have the loading artist loading. 59 00:04:44,320 --> 00:04:48,550 Loading Next, after loading, we'll have the results. 60 00:04:49,560 --> 00:04:53,810 So cut reserves after that, we'll be having this search term. 61 00:04:54,780 --> 00:04:55,830 So search. 62 00:04:56,910 --> 00:04:57,510 And. 63 00:04:59,310 --> 00:04:59,780 OK. 64 00:05:00,630 --> 00:05:04,680 And now this would be equal to the U.S. 65 00:05:05,310 --> 00:05:07,200 State context. 66 00:05:07,320 --> 00:05:10,770 So use the context. 67 00:05:12,860 --> 00:05:14,660 Basically, we are getting all the data. 68 00:05:14,910 --> 00:05:18,830 OK, so use state and context. 69 00:05:19,010 --> 00:05:21,350 Next, we will send the location. 70 00:05:21,860 --> 00:05:31,460 So after this, there will be the constant call as the location, so it will be gone. 71 00:05:34,270 --> 00:05:34,600 Look. 72 00:05:35,770 --> 00:05:44,470 A vacation and this is equal to location and use location. 73 00:05:46,040 --> 00:05:54,630 And after this, what we'll do is we'll make use of the use effect function or the use effect hook. 74 00:05:55,220 --> 00:05:56,930 So that will be used. 75 00:05:57,880 --> 00:05:58,540 Fact. 76 00:06:01,940 --> 00:06:07,700 Tired of this, it expects to function and it will be something like this. 77 00:06:08,660 --> 00:06:15,650 So inside the use effect, we will give the if statements to like if that is. 78 00:06:17,790 --> 00:06:18,270 If. 79 00:06:19,120 --> 00:06:22,930 That is a search term, so search zone. 80 00:06:23,380 --> 00:06:29,350 So then this is the empty string. 81 00:06:29,890 --> 00:06:38,670 And after that, we'll have this early braces and now inside of this, we will have the location of 82 00:06:38,710 --> 00:06:48,100 the location thought, but name is equally critical to the IS spot, which is videos. 83 00:06:50,040 --> 00:06:50,620 Reduce. 84 00:06:51,090 --> 00:06:52,770 And if that happens. 85 00:06:53,130 --> 00:06:54,810 So what is that? 86 00:06:55,260 --> 00:07:01,730 So if that videos happens, basically, you know, I put the wrong thing, you're. 87 00:07:02,810 --> 00:07:03,170 OK. 88 00:07:03,720 --> 00:07:05,800 Oh, there will be the else. 89 00:07:06,840 --> 00:07:08,490 So there would be the end. 90 00:07:08,880 --> 00:07:15,720 But after this videos, we will have, yeah, we will get the videos right. 91 00:07:16,170 --> 00:07:19,680 So we will get the results of get results. 92 00:07:20,040 --> 00:07:26,700 And inside this, there will be the tactics and directives that would be these search. 93 00:07:27,990 --> 00:07:36,160 So it's less Q is equal to its taller sign and start of this search. 94 00:07:36,360 --> 00:07:37,810 Don't search. 95 00:07:39,380 --> 00:07:45,210 And after this date and signed and the number will be 40. 96 00:07:46,280 --> 00:07:49,520 So 40 search results should be there. 97 00:07:50,150 --> 00:07:56,450 So next, moving on, we will create something more. 98 00:07:56,450 --> 00:08:02,720 So after this, there will be the L statement like if this is not true, then what we need to do. 99 00:08:03,050 --> 00:08:11,510 So there will be the L statement and inside the LS then will be the get resolved and we will have the 100 00:08:11,510 --> 00:08:12,680 same thing basically. 101 00:08:12,680 --> 00:08:15,320 So we will just copy this thing from here. 102 00:08:15,920 --> 00:08:18,440 But there will be some changes. 103 00:08:18,440 --> 00:08:21,500 So inside of this will paste is basically here. 104 00:08:21,500 --> 00:08:23,330 We don't need this account. 105 00:08:23,880 --> 00:08:31,430 We'll just eat this thing from here and we'll write the videos and inside the get results of the LS 106 00:08:31,430 --> 00:08:35,720 block, there will be some changes to. 107 00:08:35,720 --> 00:08:41,870 I will delete this basically from this part. 108 00:08:42,410 --> 00:08:47,420 So from this part, I will remove this and even add a dollar sign. 109 00:08:47,420 --> 00:08:53,420 And then there will be this early faces inside of this field, right? 110 00:08:53,420 --> 00:08:59,270 The location or part names or location, Port Botany, then this. 111 00:08:59,720 --> 00:09:02,690 Everything will be executed. 112 00:09:03,380 --> 00:09:11,300 Okay, so we are on with the final statement now this is there and this is there and one more. 113 00:09:11,300 --> 00:09:12,200 This is there. 114 00:09:12,200 --> 00:09:17,690 So now we will give the dependency area like when this everything should be executed. 115 00:09:17,960 --> 00:09:24,980 So whenever there is a change in these search term and there is the change in the location or part name 116 00:09:26,470 --> 00:09:32,810 a name for these functions or these logic will be executed. 117 00:09:33,230 --> 00:09:43,430 So next, we will move on to the other name, like what functionalities should be taken care of accordingly, 118 00:09:44,450 --> 00:09:46,370 according to the path, names and all. 119 00:09:46,820 --> 00:09:51,770 So that is the thing which we are going to do now next. 120 00:09:51,920 --> 00:09:58,370 So we will write the Switch statement and we will write them in the next video. 121 00:09:58,490 --> 00:10:01,370 So we'll see that in the next video.