1
00:00:00,650 --> 00:00:01,430
And reflect.

2
00:00:03,430 --> 00:00:05,770
And this is again going to be an arrow function.

3
00:00:08,680 --> 00:00:15,970
Now this is going to have a left keyword, and this will have a lot of random index.

4
00:00:19,630 --> 00:00:22,690
Now, this random index is going to be equal to Matt.

5
00:00:24,230 --> 00:00:29,990
The floor again gets what is generating random value.

6
00:00:34,770 --> 00:00:36,000
Not random.

7
00:00:40,000 --> 00:00:41,050
And times.

8
00:00:43,090 --> 00:00:43,750
Sixty.

9
00:00:44,820 --> 00:00:50,250
OK, so we have generated it random value, you know, we need to generate two other values.

10
00:00:52,450 --> 00:00:54,070
So right off the floor.

11
00:00:55,090 --> 00:01:01,120
Maybe creating another left, and this time we were targeting our court.

12
00:01:06,400 --> 00:01:07,750
As well as our other.

13
00:01:14,820 --> 00:01:18,330
Which is going to be equal to this not sad state.

14
00:01:20,800 --> 00:01:22,090
This two state.

15
00:01:24,740 --> 00:01:25,970
Not court data.

16
00:01:29,060 --> 00:01:34,490
And then said that it is going to have a random index because we want any did any of.

17
00:01:35,880 --> 00:01:39,330
Are courts that is present in record store data to be displayed?

18
00:01:40,290 --> 00:01:46,200
So we are presently configuring to handle Flick Matter, which is going to be activated on every click

19
00:01:46,440 --> 00:01:48,420
know a semicolon date of that is.

20
00:01:48,990 --> 00:01:52,110
Now let's create a contest and.

21
00:01:53,560 --> 00:01:54,560
It's fun to color.

22
00:01:56,200 --> 00:02:00,610
And this concert is going to be equal to this.

23
00:02:01,040 --> 00:02:03,030
Not that I know I'm going to.

24
00:02:07,980 --> 00:02:16,260
So right after this, we have created a flick method that is going to be rendered on every click.

25
00:02:16,710 --> 00:02:22,920
So right after this, we would want a game changer, document style as well body colors of a document.

26
00:02:22,920 --> 00:02:27,420
So we would be copying this to a statement because this is what we are going to paste it here.

27
00:02:27,450 --> 00:02:32,930
So this copy document about body terracotta and paste them both, the statement said.

28
00:02:32,940 --> 00:02:34,350
We need a color statement.

29
00:02:35,070 --> 00:02:37,360
So now we have created up everything.

30
00:02:37,390 --> 00:02:38,790
Now we need to assign it.

31
00:02:39,540 --> 00:02:44,760
So let's just use this or set it to assign it to our state.

32
00:02:45,090 --> 00:02:56,010
So this does it state an insider's view to signing up for people to court our third equal to or also

33
00:02:56,010 --> 00:02:58,020
that we are receiving from our API?

34
00:03:06,840 --> 00:03:10,590
And the coordinator will be assigning of color, which is identical to color.

35
00:03:12,060 --> 00:03:13,890
OK, so we have set it up statement.

36
00:03:14,760 --> 00:03:22,590
Now the question that lies with us is that where we do, we need to call a first court today because

37
00:03:22,590 --> 00:03:25,590
we have given it a function worthy what we need to even call it.

38
00:03:26,070 --> 00:03:28,740
And we're be a life cycle hook for that.

39
00:03:28,740 --> 00:03:33,450
And that is the component that is so that it is rendered off.

40
00:03:33,450 --> 00:03:34,860
The screen has been displayed.

41
00:03:35,430 --> 00:03:40,530
So we'll be using component amounts or component the amount.

42
00:03:41,840 --> 00:03:46,670
And after component amount will be calling up a fish caught in it.

43
00:03:46,820 --> 00:03:49,790
So let's just paste this.

44
00:03:51,220 --> 00:03:51,670
Not.

45
00:03:54,950 --> 00:03:55,670
First records.

46
00:03:57,220 --> 00:04:03,100
Now there's one more there, but in fact, I think that we can do in the combat zone, and that is if

47
00:04:04,150 --> 00:04:08,620
that is if we want to check that weather codes, data is having data in it.

48
00:04:08,800 --> 00:04:13,120
For example, if we have loaded our data previously and we do not want to do that same process again.

49
00:04:13,480 --> 00:04:14,920
So we would be just checking up.

50
00:04:15,460 --> 00:04:18,820
We'll be taking a if statement that we want to check with the data.

51
00:04:20,380 --> 00:04:26,920
This data is not good studied or not, so let's just give it a if they start state.

52
00:04:28,460 --> 00:04:29,420
That quotes data.

53
00:04:30,810 --> 00:04:33,270
If this starts in local state, I don't lend.

54
00:04:36,110 --> 00:04:40,220
Is greater than zero, then we do not want it to actually go fetch goods.

55
00:04:40,910 --> 00:04:44,930
So if this is the case, then what we want is that we just won't do it on.

56
00:04:46,730 --> 00:04:50,450
And if not, then we want to call up our data.

57
00:04:50,730 --> 00:04:51,800
So, I mean, fetch goods.

58
00:04:56,680 --> 00:04:58,810
So this is all settled up.

59
00:04:58,960 --> 00:05:03,520
We have handle random random color that is going to generate it for us.

60
00:05:03,880 --> 00:05:08,530
And these are the keys and this color which is having a hashtag in it.

61
00:05:08,920 --> 00:05:10,240
Not every time we call list.

62
00:05:10,240 --> 00:05:16,450
And I'm going to give us a different hexadecimal value of a color and this color is going to be assigned

63
00:05:16,450 --> 00:05:18,670
to a button as well as a vaccine.

64
00:05:19,690 --> 00:05:26,000
So not the only piece of code that remains is to add pass this data via drops into a button component.

65
00:05:26,320 --> 00:05:31,030
And so to do that, we'll be passing up four components in this first.

66
00:05:31,030 --> 00:05:38,030
One is going to be in the order and the code and this click property, click property as a color.

67
00:05:38,620 --> 00:05:40,810
So the first thing is going to be a click.

68
00:05:42,040 --> 00:05:44,230
So this click is going to be equal to.

69
00:05:45,570 --> 00:05:46,550
Let's name attendee music.

70
00:05:50,950 --> 00:05:54,940
And it is going to be able to handle.

71
00:05:56,080 --> 00:05:59,110
Click and after this, Hanzlik will give it a collar.

72
00:05:59,830 --> 00:06:03,940
So let's just give it a color, which is going to be equal to a distorted state of color.

73
00:06:10,480 --> 00:06:13,730
And after the color will give it a as a result.

74
00:06:15,010 --> 00:06:20,500
So let's go to court, this is going to be called to the state court.

75
00:06:24,070 --> 00:06:27,760
And after the court will be giving it or other so other.

76
00:06:30,040 --> 00:06:36,670
Would be equal to this note, state the other.

77
00:06:37,880 --> 00:06:39,030
So now let's refer.

78
00:06:40,190 --> 00:06:44,680
You appreciate at work and so we are having our buttons and we're passing all this data.

79
00:06:45,020 --> 00:06:50,720
No time to move into a button buttons and the fact that this button so if we just head back into our

80
00:06:50,720 --> 00:06:51,170
buttons.

81
00:06:55,320 --> 00:06:56,490
So here is about right.

82
00:06:56,610 --> 00:06:59,610
And I told you that will be adding more properties to it.

83
00:07:00,000 --> 00:07:05,940
So just give it a written statement and after this, what are getting is at 80.

84
00:07:07,260 --> 00:07:11,100
And this is going to be able to perhaps totally let me just get props in it.

85
00:07:11,580 --> 00:07:12,690
So we are having our props.

86
00:07:13,140 --> 00:07:18,090
So are we going to have an I.D. that is going to be equal to props?

87
00:07:18,150 --> 00:07:18,690
Totally.

88
00:07:22,250 --> 00:07:28,490
And after this rally, we're going to have another feature that in the background color, so we'll give

89
00:07:28,490 --> 00:07:29,420
it a background.

90
00:07:33,180 --> 00:07:36,960
And it is going to be equal to proper start gala.

91
00:07:39,820 --> 00:07:41,170
Not for this background color.

92
00:07:41,530 --> 00:07:47,380
We are going to give it a last name, which you are already given and click that whenever we click this

93
00:07:47,380 --> 00:07:53,360
function and on click this is going to be equal to hanzlik drops to.

94
00:07:55,450 --> 00:07:56,920
And click.

95
00:07:58,140 --> 00:08:00,660
So we have assigned this handle click method.

96
00:08:01,080 --> 00:08:07,110
Now we need to add one more styling to a style component, and that is going to be equal to the background

97
00:08:07,110 --> 00:08:07,440
color.

98
00:08:08,340 --> 00:08:09,780
So let's just give it.

99
00:08:10,890 --> 00:08:12,020
A background color.

100
00:08:18,550 --> 00:08:23,290
This program is going to be equal to a perhaps not.

101
00:08:25,010 --> 00:08:25,660
Background color.

102
00:08:27,270 --> 00:08:27,690
So, yeah.

103
00:08:28,660 --> 00:08:31,870
We have given it all the properties that we had.

104
00:08:32,290 --> 00:08:36,910
Now let's just take a look and see whether that's functioning or not.