1
00:00:00,390 --> 00:00:07,990
In the previous probably already experienced the use of higher order component to make the Nephi the

2
00:00:08,190 --> 00:00:10,360
function to push to another page.

3
00:00:10,770 --> 00:00:17,240
And this is the higher order functions, the higher order components that we used in the previous letterer.

4
00:00:17,880 --> 00:00:21,390
And now we are going to create our own higher order components.

5
00:00:22,200 --> 00:00:34,460
So we create a new folder and we Memphis s kind of folk and inside the functions into AGYEMAN, we are

6
00:00:34,500 --> 00:00:36,960
passing the prop to component.

7
00:00:37,820 --> 00:00:42,060
And inside the documentation, it already set a higher order component.

8
00:00:42,240 --> 00:00:45,150
It's now monistat these for we using the component logic.

9
00:00:45,270 --> 00:00:51,810
And it is a function that takes the components and we turn a new component inside a document.

10
00:00:52,170 --> 00:00:55,770
It also teach you how to we turned a new component.

11
00:00:55,920 --> 00:00:58,150
So we are going to do this in our app.

12
00:00:58,440 --> 00:01:05,790
And now we create a way that we have different cars, but we are not using the red, blue or green because

13
00:01:05,850 --> 00:01:08,310
in blue strip, the color theme is like this.

14
00:01:08,520 --> 00:01:11,480
So we copy all of this and we pace it here.

15
00:01:14,830 --> 00:01:17,960
And since there are six different type of colors.

16
00:01:18,610 --> 00:01:22,510
So we are going to randomized between zero and five.

17
00:01:22,660 --> 00:01:23,890
And we copied this one.

18
00:01:24,100 --> 00:01:25,280
And page it inside.

19
00:01:25,450 --> 00:01:26,940
We turn and the cost.

20
00:01:27,130 --> 00:01:32,150
Lam going to pass this color and this will rob the temple.

21
00:01:32,200 --> 00:01:39,700
Then we are going to empower and we will also pass the props inside the raptor components.

22
00:01:39,850 --> 00:01:44,380
Now we can go to the components and inside the about.

23
00:01:44,530 --> 00:01:47,320
We are going to import the high order component.

24
00:01:47,710 --> 00:02:00,800
And here we are going to import the colorful from the higher order component, foda and colorful and

25
00:02:01,100 --> 00:02:01,840
in export.

26
00:02:01,870 --> 00:02:06,540
We are going to wrap the about page with colorful and receive it.

27
00:02:06,760 --> 00:02:10,030
We can see there is no effect on the op ed page.

28
00:02:11,190 --> 00:02:17,870
And just because there are some mistake we just made and there should be no talk in front of the cost.

29
00:02:18,810 --> 00:02:25,060
So we have to cancel all the thought and now we can see colors on the page.

30
00:02:25,380 --> 00:02:27,940
Maybe we have to come and do it, said Tom.

31
00:02:28,080 --> 00:02:32,490
Our function inside the death bar and now every time we refresh the page.

32
00:02:34,250 --> 00:02:36,460
It will change to different colors.

33
00:02:37,920 --> 00:02:41,300
So this is how they hire order component work.