In this video, we'll see how to use this to react, Dom, and I'm creating the react different components
of, you know, skin section experience, a section, education section and portfolio sections.
So, yeah, this should be the final core of what we want to do in this video, I'll explain you all
the code line by line, why it is happening and what what we want to achieve by the from this code.
Right.
So.
So, yeah, so we have seen here all the import statements.
But what this this statement means.
So this is basically where this reactor, Rotterdam, is a dependency that we install that you can also
check over here and or package or Jason grabbing reactor or the.
That we are important, but we don't want all the functions that are present in the package.
We only want a few certain functions that are that are present in the package that are.
Doubters out and switch.
OK, so this we are importing, but we're using some curly braces, as you can see here.
But before imports, we're not using any collaborators, but here we are using the curly braces for
importing why this is happening.
This is because these are all the default exports that we are making inside these files.
For example, we'll see one go to some about section dodges.
Here you can see we are exporting this function by default.
So this is the default export about this so that it's said that no need to import that using locally.
This is but this since many one thing I remember is there can be only one function that is the default
export.
You can export as many as functions you want, insert any file or any dependency, but only one can
be D4.
So that is why, since there are many functions in the reactor room, there is only one default, but
we don't know what the default or export is.
So basically, we run through.
You will be using this calibration, then we'll be importing all the necessary functions that we want
from the reactor, Tottenham, since they are not the default export that they're just exports.
And then the next thing you have to do after importing the army is you have to create a folder called
components, right?
Create affordable components in this folder will have all the components within the folder for now,
but there will be a folder for various components.
Then there's been pages components.
You can now create organiser folders for our world education experience, portfolio profile, access
skills and all this you want.
And then you can basically, you know, fact then you can create these files.
This is a basic thing that will do.
And then.
Well, we have been warned them from the create what we created, so I show you one thing, for example,
an inside page, I'm getting a new file called Best Dark Genius.
If you do this.
And out of sea.
So this is this report that I'll be using, though if you want to have this go to package's extensions,
yeah, and then click for.
Just six is six.
Yeah.
JavaScript ethics code snippets, you can install this there are also other things reactor babbled reactor
reactor Dexia.
Well, the act.
Yes, p.m. This package is $7 Act slash redux slash draft, fast react native cineplex, this is a package
that you can start individuals.
And one thing I'll be using mushrooms to record because of this package and snippets in visual studio
code.
There is a beautiful option for all these packaging cineplex tonight, so according pack will be easy
for us to start lighting up the board.
The mini lot of kind of boilerplate what we can basically use the Cineplex so that we have the autofill
option so you can install it and run through struggles and you can read or how to reload.
Can you be reload and then click and automatically reload and then you can start using.
So what's happening is I created a folder named that's launches, right?
Fact Dargis, I'll be using this coming out of and then clicking on enter, then you can see it is automatically
creating a function called desert is returning a do and it is export defaulting that function in port
react.
And this weekend, this component, we can see it's we're exporting it can use it anywhere by importing
it.
So instead that Burgess I can import, I get import into Europe for skins that an importer test from
components slash pages slash test.
OK, so this is how all these components are imported.
All the home skills experience, the education portfolio.
There's an audit of SNL.
I have showed you how to do that.
I am gang related.
Yeah.
So this is the first, so after this thing now coming into that function part.
So what we have to get done inside the function.
So since I do worry about allowing two different pages, we have to open with it all.
And in the role that we should have out.
Rout means.
The which thing we are, do we have to like surrounded by default?
So before the switch gears, you're having something called home, right?
So initiative will to give it home.
Home will be like home means.
So as you consider completing, the whole thing is.
OK.
The home page is called home dargis so that we are rendering, often rendering.
Now we have news this which guess so bob will be here.
You can see the exact bodies slash slash wounds homepage.
So if you can see here random flash and enter, that is the same as three thousand local that you same
over the landing page.
But this slash refers to the.
You know this for sure, the homepage and then we'll discuss about this, what is this thing in the
for the upcoming upcoming minutes?
Switch now.
After having this shroud now switch gears and then let out different props.
So the party slash skins, then what me up to render?
If the round part is equal to slash experiences, then what we have to do if they're out participants
to slash education for or four wheel drive, for example.
Take this education, go to MPH and click on Slash.
Education's considering the education component rendered.
OK, so this is how the drought works.
By default, we have to give one run to the home page that is the home component and then the which
gave the depending on where you are and if you can flash skills, you have to render some different
components and we have to end up in a kind of like finish this, which gets to chill and then we have
to end the downturn, then we are exporting that.
So this is basically working with the companies like our to render the components based on their voting
power.
OK, now what is this component is equal to skills compared to the contrary experience as mean.
Like what they're actually depicting that we can see in the next year.
This is basically taught how to handle props and everything the parent level, the children level and
ability that will focus in the next video back.