Right in this video, we are going to learn how you can use the external system file in a Regius application.
So let us create a new file.
So don't worry about the way we are using now.
We are creating all files in the Stasi in the future.
Are going to learn how we can structure our different files.
We are going to put all JavaScript on all the JavaScript, file, all components of state free components
in a specific folder, and they're all stateless components in a specific fraud.
And so we are going also to group our different access files in order to structure a project.
So in these moments, you are going to suffer to get together with me and say we are going to use it
like this and in the future we are going to lend hurricaine structure is projects.
So we are going to create a new file.
That's Regla name block dot.
Yes, this block.
Let's use this like this in our that we are going to define two classes and we're going to have first
for the first class is going to be green is.
Please, it is class duchesses.
It is really, really not cyesis dots.
Yes, this is the first class is going to be equal to green and we going to say color is going to be
equal to green.
The second one is going to be orange like this.
We are going to say orange.
Color is going to be equal to orange like this.
Very good, in their words, regarding to we are going to come in our dodgiest, so we are going to
learn how we can import this class in days.
And here we are going through Clementis.
So going through.
I'm going to copy.
I'm going to pass this year, so I'm going to remove this style, because here we are not going to use
the in the in line in London.
Yes, we are going to use now the external sources and the desire is to import these different classes
in inside of our club.
Notice, I'm going to put this different style Stier's in instead of our each one take.
So as I have a class here, you can see here I have green letters back here I have green.
I'm going to take this class and import it in our each one time.
So here we are using the day six.
So in this in the a.m., if you want to declare, for example, a class attributes instead of your tag,
you're going to put a class like this.
But here we are using the sticks in our religious project.
Make sure to put class name.
Atari's.
If you're using glass like this right there, Sweet understands this glass is similar, is the same
thing with this glass.
This is a reserve its width, but it is not in attributes.
So we are going to come here and say last name at this.
Class name is going to be talked to like this, and we are going to pass our class here green, and
if we try to make here and reload this page, nothing white, nothing.
Why not think because we didn't yet import our clock NCSA in our days, let us make sure and watch regular
say Regal's say imports not slash and Regla sake lock.
Not cases like this, let us try to make sure and you will see our clock is delayed and green, as you
can see.
Very simple, very good.
Let us back in our viewers to your cards.
We have lots to assess and we're going to add a lot more each to take regular state.
We're going to college, for example, each time, for example, we're going to say, Taimur, where
you go to initialize to one Friesian, possibly this big four store here, here.
And we are going to use a lot.
Another glass.
We are going to use the orange US copy.
We're going to pass it here or a game.
Take it back here and we hit orange.
We have to put orange intense letters, come back notes the assessed code orange yellow copy and paste
it here.
Posts have orange like this, very simple, and if you try to inspect in your browser, you're going
to see here first through the H1 tag in which we have the glass is equal to green.
Very good.
And so we have also the issue to take in which we have Arin's, we have Taimur is equal to one.
So this is how you can import the the cascading style sheets instead of your religious projects.
We have this.
Yes.
Very good.
And what are we going to see in these moments?
We are going to see some drops motion in this lesson.
And in order to manage, for example, different classes that we have created in our success, we are
going to use some props motion.
So I'm going to bake here in our Abdel-Aziz.
I'm going to freeze important props here.
I'm going to say, for example, color, OK, by default, I'm going to say color is going to be equal
to true.
I'm going to set this prop here has a boring top, these colored props as a green top.
So let us bake here in our long as you can see if I want to take this true, it is true value.
I'm going to come here.
I don't.
Yes, because the clock and component is integrated in our approaches.
And here I have this data, this information, and I want to take this information and pass it to our
clock dodgiest.
And then we are going to use props.
Let us come here.
We're going to set some conditions in order to manage these classes in our projects.
And you can come here.
We are going to add a new we can take in here.
I'm going to say let us first leave it like this.
And that's here inside of our render function, we have less clock.
So let us commence this.
We don't need it anymore.
And here we are going to create a regular state.
This not.
Perhaps.
OK, so let us take this and display this, display this in our concert, like to see what regular health
council does not these does props and we are going to see different props that we have in our club to
test from our approach.
Yes.
Let us make sure.
Let us come in.
I Consolo, you will see we have Collo by default is equal to true because we have defined this in our
updates.
As you can see, if they try to change to false letters back here and you're going to see letters reload
page.
And.
His approach is.
If this does pass, look, Lord, just.
Yes, we have it here.
Air Force is a cultural force, yes, very good, it does make you look to chase.
He's going to see you here, cosmologists thought perhaps we have purpose here first by default, but
here we have also for my custodies, but it can't be accessible in our block doges.
It displays only if we trade, for example, say it's not a dot brain freeze in order to black.
As you can see there, the Swiss were put dots brings.
You're going to see it is going to be undefined.
Those brains, that is.
And funny because the brain is not the, uh, information for our club dodgiest, it displays only so
in a case if we put, for example, color and let us try to make here and by the forties can see we
are going to have false.
Very good.
So this is a problem that we have the only one that we have in our club doges.
So we are going.