1
00:00:00,810 --> 00:00:06,180
The last video we saw how to work this with the reactor dome that we installed, hoping for the company

2
00:00:06,210 --> 00:00:10,950
to produce this using literature of their relevance, which is not an audience which, as you can see,

3
00:00:10,950 --> 00:00:14,070
we're importing it over here and exporting.

4
00:00:14,070 --> 00:00:15,530
It's by for now.

5
00:00:15,810 --> 00:00:20,880
Well, considering what what props up the gear, you can see component is going to scan something,

6
00:00:20,880 --> 00:00:21,080
right?

7
00:00:22,560 --> 00:00:24,060
So props are basically.

8
00:00:25,670 --> 00:00:32,610
For example, Considérer react sorry or definitely an element like, for example, will consider it

9
00:00:32,690 --> 00:00:32,890
one.

10
00:00:33,290 --> 00:00:35,990
OK, liquid image deck image.

11
00:00:39,990 --> 00:00:40,640
August.

12
00:00:43,270 --> 00:00:44,010
You didn't get it.

13
00:00:44,890 --> 00:00:45,130
Yep.

14
00:00:46,610 --> 00:00:49,560
So here in Sadie Mitchell, why did we get better?

15
00:00:49,580 --> 00:00:52,850
Because inside this return, we should have only one division.

16
00:00:53,150 --> 00:00:57,890
So since this is all, there is a division of this law very clearly Madoff, the additional debt, that

17
00:00:57,890 --> 00:00:59,260
means this is a new element.

18
00:00:59,840 --> 00:01:02,030
So there should be only one element that can do that.

19
00:01:02,030 --> 00:01:02,830
So we are getting at it.

20
00:01:03,200 --> 00:01:07,490
So everything that you want to do, you have to like start with the division, a big decision.

21
00:01:07,490 --> 00:01:09,770
And then in the division, you can do whatever you want.

22
00:01:10,190 --> 00:01:12,740
Since the reactor will only return, only one element.

23
00:01:13,580 --> 00:01:17,660
So if you type an image, you're reading something like source and alternative, right?

24
00:01:18,440 --> 00:01:21,500
So these are basically attributes of the HDMI that image.

25
00:01:22,010 --> 00:01:25,850
So a lot of these activities, so these are basically the activities that are given by the original

26
00:01:25,850 --> 00:01:28,350
who created the HDMI things and everything, right?

27
00:01:29,030 --> 00:01:31,190
Those are the colors, attributes.

28
00:01:31,550 --> 00:01:34,940
So we are sending some of our list here that will be used by this element.

29
00:01:35,330 --> 00:01:43,550
Similarly, this all listings in green color, other HDR elements that are created by the user by some

30
00:01:43,550 --> 00:01:48,910
third party user so that through their connect components, they are the equipment individually but

31
00:01:48,950 --> 00:01:52,310
customized tags or elements that have to be edited by the users.

32
00:01:52,760 --> 00:01:55,910
But creating the React projects based on their needs.

33
00:01:56,450 --> 00:02:00,950
That's what they're called components and the attributes that are used in the component chocolate props.

34
00:02:01,520 --> 00:02:05,540
So here we can generally and this kind of stuff, maybe one percent JavaScript object.

35
00:02:05,540 --> 00:02:08,900
Also, we can send using them curly braces.

36
00:02:09,500 --> 00:02:12,020
So this is what the props means.

37
00:02:12,800 --> 00:02:16,220
So you can see component is the name of the props and representing.

38
00:02:16,220 --> 00:02:21,680
Sending some value for this value we are using is because this is a JavaScript object.

39
00:02:22,030 --> 00:02:24,230
But basically, we are importing some function here.

40
00:02:24,620 --> 00:02:26,390
The skills is a function from that.

41
00:02:27,290 --> 00:02:31,370
If you can see here in the content the components inside skins.

42
00:02:32,270 --> 00:02:37,610
This gives it a function right in exporting this function so that if a JavaScript function, that's

43
00:02:37,610 --> 00:02:38,950
why we're using this Stanlib basis.

44
00:02:39,400 --> 00:02:44,960
If you want to send only some text, then you will be using a quotation quotation mark double quotes.

45
00:02:45,680 --> 00:02:50,870
But since you're training a JavaScript opportunities in calibrated retention, what we actually need

46
00:02:50,870 --> 00:02:53,570
is somebody that we are rendering this component.

47
00:02:54,290 --> 00:02:58,070
If you go to homebodies, you can see here.

48
00:03:04,250 --> 00:03:04,490
Yeah.

49
00:03:04,970 --> 00:03:07,010
So, yeah, so we're getting this components.

50
00:03:07,400 --> 00:03:07,740
OK.

51
00:03:07,760 --> 00:03:10,910
We now understand what props are, what we are doing here.

52
00:03:11,360 --> 00:03:15,110
Initially, we want to render the home page with using the wall component.

53
00:03:15,680 --> 00:03:18,890
So we see what does one component contains.

54
00:03:19,370 --> 00:03:20,900
So go to this home.

55
00:03:20,960 --> 00:03:27,190
That is basically we are importing react and component on our profile.

56
00:03:27,190 --> 00:03:31,850
Reports confirm we're importing all and everything like all the components, because this is the one

57
00:03:31,850 --> 00:03:33,710
page you want all the components to be rendered.

58
00:03:34,280 --> 00:03:40,510
So what we are doing, but creating a default class will make sense component so that this can be functional.

59
00:03:40,520 --> 00:03:41,480
So there's no problem.

60
00:03:41,780 --> 00:03:43,490
We are getting it and we are returning it.

61
00:03:43,910 --> 00:03:44,390
So what?

62
00:03:44,390 --> 00:03:50,450
We are returning, we are returning a section that contains and now but now what is a component again?

63
00:03:50,690 --> 00:03:52,520
Well, because what does this now work on?

64
00:03:52,790 --> 00:03:58,880
Our component has been discussed in the upcoming videos, but we'll focus on this one and bring another

65
00:03:58,880 --> 00:03:59,360
component.

66
00:03:59,840 --> 00:04:05,750
So this is giving this number closer to the debugger tool called double page design.

67
00:04:05,750 --> 00:04:13,550
If you click on this, you can see all the divisions on the all the contents in the double page in the

68
00:04:13,550 --> 00:04:14,720
form of rectangles.

69
00:04:15,890 --> 00:04:20,060
OK, so that this tool will be useful for styling and everything.

70
00:04:21,440 --> 00:04:26,810
So once you are importing this, you know this now by this, we are importing A..

71
00:04:27,820 --> 00:04:30,550
Now we're creating a division with glass and content.

72
00:04:31,790 --> 00:04:38,630
And then our division low profile about can, so basically we'll have our eye level knowledge of what

73
00:04:38,630 --> 00:04:39,110
we are doing.

74
00:04:39,440 --> 00:04:44,330
This is simple hedged in its denial of its dividends, years of creating divisions.

75
00:04:44,330 --> 00:04:51,110
So using class names and everything since you are this is a reactor project, we will not are not discussing

76
00:04:51,500 --> 00:04:54,260
more about these divisions and styling properties.

77
00:04:54,530 --> 00:04:54,890
OK?

78
00:04:55,310 --> 00:04:55,790
This.

79
00:05:00,150 --> 00:05:04,050
So basically, this division container, what does this division contain and means?

80
00:05:04,050 --> 00:05:06,210
What does distribution division rule means?

81
00:05:06,810 --> 00:05:10,260
This is you can you see using the bootstrap documentation?

82
00:05:10,410 --> 00:05:10,740
OK.

83
00:05:11,610 --> 00:05:17,910
So Romans, basically we are creating a row in which there are two columns, one is water and one is

84
00:05:17,910 --> 00:05:19,380
medium smart small development.

85
00:05:19,380 --> 00:05:23,490
It will pick a one by 12 top to hold it all in my medium.

86
00:05:23,490 --> 00:05:25,560
Nine means it will take one ninth of the rule.

87
00:05:25,770 --> 00:05:26,220
Like that.

88
00:05:26,790 --> 00:05:33,170
The profile about skins, if you can see it profile is taking some part of the rope.

89
00:05:33,510 --> 00:05:37,980
And then this approach skills, experience, education and everything is taking the other part of the

90
00:05:37,980 --> 00:05:38,160
rope.

91
00:05:38,610 --> 00:05:40,560
So this is what this division will do this.

92
00:05:40,860 --> 00:05:42,480
This is basically comes with practice.

93
00:05:42,480 --> 00:05:44,010
You can understand that.

94
00:05:44,010 --> 00:05:48,390
But what you have to understand this, we are basically rendering the competency all the components

95
00:05:48,390 --> 00:05:50,610
that we created, all the components we created.

96
00:05:50,610 --> 00:05:53,090
We are importing it and then we are using it.

97
00:05:54,400 --> 00:05:57,910
OK, so this is what home contents.

98
00:05:58,270 --> 00:06:03,790
So now in this video, we saw what drops means like basically there's the attribute on the custom,

99
00:06:03,790 --> 00:06:05,170
which generally means that we are operating.

100
00:06:05,500 --> 00:06:05,860
OK.

101
00:06:06,220 --> 00:06:10,120
And how we are sending it to the bottom level, the children level.

102
00:06:10,120 --> 00:06:14,770
And then we are using those home and we are rendering the on the component storm branches.

103
00:06:15,310 --> 00:06:20,090
So now, OK, profile boards, skills, explain all this component of that.

104
00:06:20,320 --> 00:06:21,060
But what?

105
00:06:21,240 --> 00:06:27,520
What is actually inside that like how to implement this walks like you are getting all this stuff and

106
00:06:27,520 --> 00:06:28,090
everything.

107
00:06:28,480 --> 00:06:33,360
Each company will discuss about each and every component, how the code is running into the components

108
00:06:33,670 --> 00:06:34,470
from the next video.

109
00:06:34,750 --> 00:06:35,140
Thank you.