Paragraph ends here in our index duty, yes, we are going to integrate all our application, which
is in our approaches, because we are going to create applications, we are going to create several
components which is going which are going to be included in our approaches.
And in years, we are going to take all approaches in which we have all our application and integrate
these components here in order to be rendering to the dome, which is our.
So let us make our approaches and can see if we try now to make here and reload the page we have here.
So what the saying says, let us back here and you can see line six 18 up is not define it as you can
see in which file index today.
So let us make our index today as we have line six.
It's in the sense that app is not defined because we need to import the app today is in our index,
that is in order to use the components, the app component.
So we are going to come here and we're going to say in part we're going to say imports up Latisse.
From.
And the Far East and the same roads, and you're going to choose up to chase here, you can see here
and now you can see attempts in parts and we have, you know, their message er we have up does not
contain a different experts like you can see dots up.
That means this approach is does not contain any effort expert.
What it means was creating your components in the end here you need to export your components, reason
why you hit, reason why we have this ear.
So you need to say exports, defaults like this and you are going to export your function like this.
Where are you going to set up?
As you can see here.
And here you can you can declare your functions and in small case, so it doesn't it is not a problem.
You can say function up like this, you can say function up like this, but where?
Well, importing your your components, you are going to name it like this.
The first letter must be uppercase and here in part your fault.
So I'm going to show you why, because if you try to put in small case like this and if you try to put
it like this, you're going to see it will be like a a e inishmaan.
It's a six a tag like in each one.
Sikich can see if you try, for example, to declare in each one lattice.
You can see it is like this and it will be like a niche type, but not as a component's reason, what
you need to put the first letter in uppercase and here you are going to put like this and it should
be a cholerae like this.
And if we try to back up dodgiest here, we can export like this.
Or you can also put a Knopper case for the first letter Esurance.
But I prefer to do it like this.
And if we try to export like these export defaults up and here we have imports up and import the to
chase and let us big first try to reload the page, you're going to see we are going to get the same
message here.
Lauret, very simple.
OK, and let us try the first row to make way up doses.
As you can see, this is a state list components.
Its deadly components does not contain data.
Is this list components.
It allows us to return to view only a message, for example, as you can see, to view something.
But a stateful components are a plus components is used to contain data in the states and they can also
view information like the statelets components.
And this is a function.
And then if we are using, for example, the SSX, which is the which is the modern JavaScript schema,
script six, instead of using this Kando function, you can use the zero function.
As you can see a for example, here we get a function up.
You can say, for example, you can declare, for example, an error function like this.
You remove all this and hear what you going to say.
You want to put the arrow like this.
This is your function.
And here you can see and accept it in exchange.
Call and yes, expect it in a sec.
In a sentence or function call and instead sought expression up is not defined, is up, is not it?
If you want to define this we can say for example const.
He's going to be escorted to this.
It costs, yes, cost our police costs up is going to be our error function, and during this course
we are going to be.
This is Eskimo's scripts, a function type, as you can see here.
This is the in the modern age of the modern JavaScript.
So let us make sure and if you try to read this page, you're going to see that we're going to get the
same thing.
And this is how to declare, for example, a stateless component or a function components.
You are going to use it a function.
And let us talk about this.
It's four components how to create a state, three components to create a state, three components you
need to.
Youth class and hearing asset class, pulling them out of your class and make sure here we are creating
a class, you can see as far as you know, if you want to create a class, you have to use this notion
in the first letter of the name of your class must be in uppercase.
As you can see here, we are going to create a component's a name ID up by using class because it is
a for components.
And we are going to say class up extends.
They must extends another class, which is components and hearing I say class up extends reciept, not
because we have imported the results dependence and here we are going to call the component class.
Lattice components put your codebase braces like this.
As you can see, and here we are going to export like this, you need to stand here and put in our bridges
and what are we going to do if you want to return, for example, this message?
Because in the future, we're going to see how we can integrate the data in these type of scans of the
components, which is this effort we're going to call the render function in the class components you
are going to call during their function in inside of your render function.
We are going to put these ireton functions.
So, you know, to return, for example, a message that is because we have a component with these three
components, we can return a message.
We can give you message, display message.
We can also contain a star data.
And as you can see here, we written like this.
And if I tried to make here and reload a page, you are going to say we are going to get the same thing.
This is the in order.
You can use if you want to example inputs, create the components.
Let us throw a take this problem here.
Instead of putting those components, you can remove results.
You can come here and put comma up in your college courses and you are going to say components like
these components.
And if you try to make sure you are going to, we are going to have the same thing there, same poll.
And this is a four components here.
We are using glass and notice, for example, we have this written function.
If you are written, for example, only one called a single card's a single line code.
You can do like this.
You can come here.
OK, and if you try to make sure we are going to get the same thing here, you can see the same thing
while using a distastefully components in a glass or a statelets components in your function, the same
thing.