1
00:00:00,270 --> 00:00:06,360
So next, what we'll do is we'll create another like like an array using the used to talk.

2
00:00:06,780 --> 00:00:14,610
Before that, we'll write, contest and copy that the name of that particular area would be cocktails,

3
00:00:15,060 --> 00:00:19,290
and that will be like creating using their used data.

4
00:00:19,740 --> 00:00:23,550
So cocktails is the variable like right now.

5
00:00:23,550 --> 00:00:32,910
It's not specified who what it is, but the specification is done over here and we provide the initial

6
00:00:32,910 --> 00:00:33,300
value.

7
00:00:33,690 --> 00:00:36,630
And here, for example, in this, we have provided tools.

8
00:00:36,630 --> 00:00:39,600
So that means it's a Boolean and we are provided a string.

9
00:00:39,600 --> 00:00:42,780
So that means it is a it is a string.

10
00:00:43,110 --> 00:00:44,850
So that is what we are doing here.

11
00:00:44,880 --> 00:00:49,440
Next, we will write the function to set cocktails.

12
00:00:53,230 --> 00:00:55,960
And this would be equal to you with the state.

13
00:00:57,920 --> 00:01:05,560
Users state and inside this will ride the initial value to it, so the initial value is an empty at

14
00:01:05,570 --> 00:01:10,850
a now whatever we specify here, that is the particular data type of this variable.

15
00:01:11,180 --> 00:01:14,330
So here I have a specified and empty array.

16
00:01:14,690 --> 00:01:19,460
So that means this is an empty array and that has no value inside this right now.

17
00:01:19,880 --> 00:01:24,140
Or you can provide a semicolon here if you want, or you can leave it as it is.

18
00:01:24,770 --> 00:01:27,830
I will do it like this for the sake of the convention.

19
00:01:28,280 --> 00:01:31,760
And now we will make use of this particular A..

20
00:01:32,060 --> 00:01:35,270
So when we go down, so after this return?

21
00:01:36,250 --> 00:01:44,380
What we will do is we will get rid of all of the late night tubes and things, so let me just provide

22
00:01:44,400 --> 00:01:46,720
semicolons and let me set up the.

23
00:01:47,840 --> 00:01:57,320
Conventional so often we are done with this, but it done for this complete if block, like whenever

24
00:01:57,320 --> 00:02:00,770
this is executed, it will return a particular.

25
00:02:01,550 --> 00:02:07,700
OK, so we have done all, we have returned all of this and once this is done.

26
00:02:08,960 --> 00:02:09,250
OK.

27
00:02:12,520 --> 00:02:16,930
So inside this, only like after all of this is done, they're done, is done.

28
00:02:17,260 --> 00:02:18,460
And this mapping is done.

29
00:02:18,460 --> 00:02:24,850
So after the mapping is done, what we'll do is we'll set the to new deals.

30
00:02:24,890 --> 00:02:26,650
Now what is the new Google new cocktail?

31
00:02:26,650 --> 00:02:37,390
Is this particular one strand which we have created or Will said that said, it's not an uppercase that.

32
00:02:38,450 --> 00:02:38,630
What?

33
00:02:39,290 --> 00:02:42,860
Basically, this function that via via just calling this function.

34
00:02:43,370 --> 00:02:45,140
OK, well, that will be.

35
00:02:46,910 --> 00:02:54,620
That cockatiels and inside this will pass of like an argument, and that argument will be the value

36
00:02:54,620 --> 00:03:01,280
to this variable, whether it is a tree or a string or a Boolean, whatever it is.

37
00:03:01,610 --> 00:03:08,180
So here what we'll do is we'll pass the new cocktails we'll write in the new year.

38
00:03:09,000 --> 00:03:10,580
Then we'll provide a semicolon.

39
00:03:10,940 --> 00:03:18,590
Now what this does is that Ben discovered this piece of code is executed so that the control comes over

40
00:03:18,590 --> 00:03:27,350
here and this function is called and the argument is parsed inside this and the whatever is the value

41
00:03:27,560 --> 00:03:28,460
of that argument.

42
00:03:28,460 --> 00:03:32,810
So that becomes the value of this cocktail variable.

43
00:03:32,840 --> 00:03:36,080
OK, so that is what we have done.

44
00:03:36,560 --> 00:03:36,800
OK.

45
00:03:37,170 --> 00:03:39,140
Next, we'll write the L spot.

46
00:03:39,770 --> 00:03:44,140
So far, we have only written if by not if this is correct.

47
00:03:44,230 --> 00:03:46,940
If this the condition is true, this will execute.

48
00:03:46,950 --> 00:03:49,490
But what if the condition is not true?

49
00:03:49,850 --> 00:03:53,540
So for that, we'll write the L'ESPOIR rule.

50
00:03:53,620 --> 00:03:54,710
Here we go.

51
00:03:54,710 --> 00:03:58,700
After like wherever this f is ending, we'll provide an alt block.

52
00:04:00,370 --> 00:04:03,610
Well, else at this.

53
00:04:04,740 --> 00:04:07,530
I like tech cocktails.

54
00:04:09,120 --> 00:04:10,460
Expect cocktails.

55
00:04:12,330 --> 00:04:18,240
And then I'll pass an empty area like if we have not received any data, so what?

56
00:04:18,240 --> 00:04:22,080
We are going to read nothing and empty a simple, empty area.

57
00:04:22,080 --> 00:04:23,490
So that is what we have done.

58
00:04:23,790 --> 00:04:29,220
And whenever we are searching for something and we don't get, we don't get anything.

59
00:04:29,220 --> 00:04:35,250
And the length of the result is like it's like zero like less than one.

60
00:04:35,820 --> 00:04:39,840
So that means we have not they have not got the desired results.

61
00:04:39,840 --> 00:04:44,550
So we'll just display that, nor does are found on all my time next.

62
00:04:44,910 --> 00:04:53,390
What will do is all of when all of this is done, well, that means we have have the data or we have

63
00:04:53,400 --> 00:04:58,470
at least grab that response, whether it is our data or whether it is an empty array.

64
00:04:58,950 --> 00:05:02,760
After all, this is done, Will said, downloading two files.

65
00:05:03,360 --> 00:05:04,680
So after this?

66
00:05:06,190 --> 00:05:07,000
Bill, right.

67
00:05:08,470 --> 00:05:19,030
Let me check whether things are ending, and I try only inside the if and it's and basically after the

68
00:05:19,030 --> 00:05:22,990
ends, we'll ride this, that lauding.

69
00:05:25,360 --> 00:05:33,910
So what we're doing and we'll pass all that, Mr. Data has been grabbed.

70
00:05:34,490 --> 00:05:38,110
Now you can just take rest and you can be like, say, two faults.

71
00:05:38,710 --> 00:05:39,250
So.

72
00:05:40,700 --> 00:05:43,100
And now we'll ride the catch block.

73
00:05:43,340 --> 00:05:50,260
Right now, we have just returned the tribe block and now we'll ride the cats block, like if what if

74
00:05:50,810 --> 00:05:57,130
things go didn't go according to us and we we're an error, and that is a problem too.

75
00:05:57,770 --> 00:06:01,430
That needs to be displayed using that gas that it will cause the error.

76
00:06:01,830 --> 00:06:07,760
OK, so that is a side loading here, and it is set to false.

77
00:06:08,120 --> 00:06:15,240
And after that from here, let me see Batista try getting over here.

78
00:06:15,660 --> 00:06:16,700
I is getting over here.

79
00:06:16,750 --> 00:06:19,120
So from here, will Randy catch block?

80
00:06:19,610 --> 00:06:21,230
So throw me in right catch.

81
00:06:22,920 --> 00:06:24,810
And so that will be.

82
00:06:27,240 --> 00:06:29,280
An argument that doesn't add up.

83
00:06:29,700 --> 00:06:33,570
And now in saying this is biased.

84
00:06:34,810 --> 00:06:43,570
Like we like, right, whatever we need to do once it has been resolved, so we will right console,

85
00:06:44,380 --> 00:06:52,690
like will console better console not log better will ride the better, it won't sweat enough.

86
00:06:53,560 --> 00:06:57,130
Next, what we'll do is we'll send the loading to Salt Lake.

87
00:06:57,630 --> 00:07:00,200
OK, stop the data.

88
00:07:00,250 --> 00:07:07,660
That is an error, so don't need to display the loading video, so we'll start alluding to false.

89
00:07:08,690 --> 00:07:13,520
And next, what we'll do is we look like this is this was it for.

90
00:07:15,040 --> 00:07:15,800
All of this.

91
00:07:16,240 --> 00:07:25,570
But now we want to write some like it was effect function to whenever the search term changes.

92
00:07:25,570 --> 00:07:32,740
All of this needs to be like rendered and all of that function needs to be fired off or that we need

93
00:07:32,740 --> 00:07:35,950
to do so after the catch is over.

94
00:07:36,040 --> 00:07:41,050
OK, let me see where Kate is getting over after the catch is getting all word.

95
00:07:41,830 --> 00:07:48,700
So because this all is happening inside the U.S callback, OK, so inside the U.S callback, OK, we

96
00:07:48,700 --> 00:07:51,900
also give an like an dependency.

97
00:07:52,600 --> 00:08:00,610
Or we can just see an I.D. so that this all thing is dependent on the search term, basically.

98
00:08:00,850 --> 00:08:01,510
So we will.

99
00:08:02,840 --> 00:08:06,560
We'll provide that inside this dependency on for.

100
00:08:07,640 --> 00:08:19,340
After this is done or it and and we will give a command and we'll give our dependency to the dependency

101
00:08:19,340 --> 00:08:29,060
area, will will ride the variable on which all of the function is taking place or all all of the water

102
00:08:29,060 --> 00:08:30,050
will be returned.

103
00:08:30,260 --> 00:08:33,950
So that is dependent on a particular variable.

104
00:08:34,220 --> 00:08:36,740
With that particular variable will be the star system.

105
00:08:38,940 --> 00:08:39,420
But.

106
00:08:40,340 --> 00:08:40,700
Don't.

107
00:08:42,610 --> 00:08:43,120
And.

108
00:08:44,970 --> 00:08:45,260
OK.

109
00:08:45,870 --> 00:08:49,560
So this is the variable for on which everything is dependent.

110
00:08:51,220 --> 00:08:57,700
So next will be writing a you a state like whenever we change, whenever we change that.

111
00:08:58,030 --> 00:09:00,670
Like when we type in that input box.

112
00:09:00,700 --> 00:09:07,420
OK, so there would be a variable that will be storing that variable like whatever we input, whatever

113
00:09:07,420 --> 00:09:11,650
the input, we are typing that variable as this search term.

114
00:09:11,980 --> 00:09:17,770
Now on what every execution is dependent, this particular variable that is the system.

115
00:09:18,070 --> 00:09:23,140
We'll make another use a fact hook and insert that they use effect.

116
00:09:23,680 --> 00:09:26,260
We'll call all of this function.

117
00:09:27,910 --> 00:09:35,950
Would that function, this all function will be executed only when this particular dome changes, so

118
00:09:35,950 --> 00:09:39,310
for that, we'll be using the use effect.

119
00:09:39,380 --> 00:09:43,330
OK, well, let me first import OK, I've already imported that.

120
00:09:43,690 --> 00:09:46,120
And now let us use it inside our core.

121
00:09:47,840 --> 00:09:51,470
So after we are done with this, so it's done.

122
00:09:52,430 --> 00:09:59,990
Let me provide a semicolon here and after we have done here who all we will provide.

123
00:10:01,690 --> 00:10:03,000
They use affect talk.

124
00:10:05,760 --> 00:10:16,620
So let me not get stuck in here to what we'll do is we'll do it, use effect and use effect expects

125
00:10:16,620 --> 00:10:21,390
a function basically if we don't know and if you don't know about you as vote, you can just google

126
00:10:21,390 --> 00:10:21,540
it.

127
00:10:21,990 --> 00:10:25,020
It's a really, really important talk if you're working with React.

128
00:10:25,590 --> 00:10:32,350
So inside this, what is the function that needs to be executed on the change of that particular variable?

129
00:10:32,760 --> 00:10:33,240
Now.

130
00:10:34,290 --> 00:10:39,870
We have only created one function so far, and that is this that is this.

131
00:10:41,510 --> 00:10:42,260
Better drinks.

132
00:10:42,620 --> 00:10:45,920
So that is the only function that needs to be called.

133
00:10:45,950 --> 00:10:47,340
We don't have anything else.

134
00:10:47,690 --> 00:10:52,180
So we'll provide that inside the EU as a federal civil rights fetch.

135
00:10:53,090 --> 00:10:54,470
Name of the function, basically.

136
00:10:56,390 --> 00:10:56,860
Brings.

137
00:10:57,950 --> 00:10:58,640
And.

138
00:11:00,050 --> 00:11:01,130
We'll provide this.

139
00:11:01,340 --> 00:11:04,480
So this is the function which will be called then.

140
00:11:04,770 --> 00:11:11,900
Now here you should ask a question to yourself then when this function will be called, what is the

141
00:11:11,900 --> 00:11:14,960
condition for calling this particular function?

142
00:11:14,960 --> 00:11:19,430
So then you will provide the variable to this dependency.

143
00:11:20,480 --> 00:11:27,290
Now, if this is left blank, that means this function would be called only once when the pages loaded.

144
00:11:27,650 --> 00:11:28,820
So here you will write.

145
00:11:30,600 --> 00:11:38,830
A variable name that is the search term and activity which is responsible for the execution of this

146
00:11:38,830 --> 00:11:41,350
particular function is fetching drinks.

147
00:11:42,760 --> 00:11:44,580
Rich drinks.

148
00:11:45,530 --> 00:11:49,760
Oh, I'll provide a summary gotten here and.

149
00:11:51,090 --> 00:11:52,830
That's it, basically.

150
00:11:55,020 --> 00:12:00,450
Now what we'll do is we'll return the provider and we'll move further with the global welcome texting

151
00:12:01,140 --> 00:12:01,520
too.

152
00:12:02,250 --> 00:12:03,840
That will do in the next video.