1
00:00:01,020 --> 00:00:04,220
We can easily at stay to the bottoms components.

2
00:00:04,470 --> 00:00:14,430
But until now the only way to pass data to a component is to bring was to move a stage to a higher component

3
00:00:14,460 --> 00:00:16,380
and then pass it back to the Springs.

4
00:00:16,380 --> 00:00:17,540
We are props.

5
00:00:17,820 --> 00:00:24,510
Now we will create an app that the FTA as include a component eight and a component a will include a

6
00:00:24,510 --> 00:00:29,470
component B and a component B will also include a component c.

7
00:00:29,850 --> 00:00:37,410
In this case we need to pass the state from the top levels of the application through all the intermediary

8
00:00:37,860 --> 00:00:44,610
to the Component c given to the component a and component B do not need this data.

9
00:00:44,610 --> 00:00:53,220
This is tedious and time consuming and also long as props during contact for Y is a way to pass data

10
00:00:54,000 --> 00:00:59,870
through the component trees without having to pass the props down manually at every level.

11
00:01:00,720 --> 00:01:05,370
This is a brand new app without any fancy and just have a brand.

12
00:01:05,410 --> 00:01:05,920
This.

13
00:01:06,660 --> 00:01:10,010
And now we are going to create a few components.

14
00:01:10,200 --> 00:01:19,230
So now we are going to make a photo's called components and First we create a component a thought the

15
00:01:19,230 --> 00:01:23,430
S and we type our FC

16
00:01:29,540 --> 00:01:32,050
and then we create a component B

17
00:01:36,710 --> 00:01:38,990
and we also create a component C

18
00:01:48,510 --> 00:01:59,330
type component aid add component 8 and then we go to a component B and type component B and also add

19
00:01:59,330 --> 00:02:01,140
a C we do the same things

20
00:02:07,250 --> 00:02:11,070
and now inside the component a we are going to import the component B

21
00:02:25,360 --> 00:02:29,890
and then we go to the component B we will import a component C

22
00:02:34,970 --> 00:02:42,680
now we back to the AB J S and we are going to try to pass a where the O from the app J asked to the

23
00:02:42,740 --> 00:02:45,910
component C directly by using context.

24
00:02:46,040 --> 00:02:57,980
We go to the app J S and then we are going to export cornerstone name contest is equal to we at all

25
00:02:58,370 --> 00:03:01,230
a contest.

26
00:03:01,400 --> 00:03:08,210
Now we are going to wrap the whole app by using the name contrast thought for wider but first we are

27
00:03:08,210 --> 00:03:10,580
going to import the component a

28
00:03:22,550 --> 00:03:24,730
a component B.

29
00:03:24,850 --> 00:03:28,000
We forgot to import a component C

30
00:03:33,490 --> 00:03:37,090
Now you can shoot a all the components on the website.

31
00:03:37,090 --> 00:03:40,570
Now we are back to the EPC ash and we are going to use the contest.

32
00:03:40,690 --> 00:03:55,370
So we need to wrap the whole app using the ram contest stop provider.

33
00:03:55,660 --> 00:03:58,570
For example we passed a where Leo Smith

34
00:04:13,180 --> 00:04:18,640
and then we go to the component C and then we we import the contest

35
00:04:28,250 --> 00:04:30,160
and then we are going to consume the contest.

36
00:04:30,160 --> 00:04:33,050
Oh we have to use the name contest our consumer

37
00:04:43,980 --> 00:04:47,760
now is everything right.

38
00:04:48,180 --> 00:04:55,770
The names move should be appear at a component C so let's take a look at the component C contenders.

39
00:04:55,890 --> 00:04:56,270
Where are they.

40
00:04:56,300 --> 00:04:56,600
Here.