All right, and the last thing that I want to do before we actually start typing away is to set up more
and more assists and global styles.
And before we continue, let me just say that throughout the project, we will use success in dress
more specifically styled components.
And I'm going to talk about my choices once we actually get there.
Once we installed style components and all that.
But with that said, don't worry, we won't be typing scissors.
Only the first page.
I believe the landing page will Typekit this.
Yes, and then I'll show you where to get all the resources.
Because, like I said before, if you start typing scissors for this type of project, then there's
going to be easily another five hours of our time.
And essentially, even though I'm a big fan of CIUSSS in jazz, I'm even a bigger fan of normalized
U.S. and global styles for the following reasons because it really saves me time on the setup, and
I use the same setup pretty much in every project, not just react when all gadsby on or whatever,
even if it's just the email insists, I actually use this type of setup because it allows me to type
less lines of code.
The easiest code in the process, it speeds up the development tremendously, and you'll see what I'm
talking about as we start using it.
Now what is normalized here?
So for those of you who don't know, it's a small scissors file that pretty much provides a cross browser
consistency in the default styling of HDMI elements.
Now, if you want to find out more info, here's the resource for Normalize.
And as far as the install, we need to look for npm, install and then normalize this.
So let me show you there on page.
Basically, this is where you navigate.
Now, if you want, you can download effectively.
This is just going to be a success code, which you can add to any of the files you want.
But in our case, we're going to go with npm and install when we want to import normalized RSS in the
in the Congress.
But what's really, really important is to place it before in next year.
So if we take a look at our index tracks right now, we do have a nexus, correct?
So once we install the normalized one, we want to import that in the next just because we want to apply
it to an entire project.
But we want to do it before in next us because in our global stars, we will be relying on the normalized
one.
And as far as the global stars, we just want to replace the content of the index RSS.
Now, if you do have any questions about normalized or specific styles on my channel coding addict,
there's an actual video by the name of defroster, where I cover everything in great detail, and I
actually created a repo with my default starter as well, which again, I utilize pretty much in every
project.
So let's start by getting the normalized Jesus.
Then just follow the link or simply type npm install normalized CIUSSS.
And in my case, I'm going to showcase one more time to site.
OK, this is where you navigate.
You grab the command not to stop the server with control and see on line.
We want to copy and paste, install normalized RSS.
And then, like I said, we're looking for in next Jass and before next year says we simply want to
go with import.
And then let's just type normalize.
And yes.
So this is going to give us that basic setup.
And essentially just the quick side note, when we're talking about Normalize, it's a fancier way of
doing this.
So if Martin zero padding, zero box sizing and we're applying that to all the elements, so this is
just a fancier way of doing that.
So I open this up and p.m. start online.
And once everything is up and running, we just need to get our indexed RSS.
Replaced by the whatever we have in the assets.
So let me navigate to the assets we're looking for csv file in Texas.
And again, you can either drag and drop or you can just copy the contents.
So in my case, I think I'm just going to drag and drop.
Yup.
I want to move it to the source again is going to ask whether I want to replace it.
Yep, I do.
And then once we serve it, we should see different styles.
And if you take a look at the index, it's pretty much a bare bones setup where I'm using some CIUSSS
variables for two colors, so you can always replace those.
Of course, there's some fans.
There's also box shadows and all that, and there's some typography set up.
And if we keep on scrolling, there's also some global classes.
And again, the benefit of such setup is the fact that I don't have to repeat myself throughout the
project, which in the long run.
So a bunch of time.
And if I ever need to customize something, I can do that very quickly with the help of stored components,
which we're going to cover in Futuras.
But in general, yes, this is pretty much my default setup.
And if you do want to find out more info again, here's the video.
When I cover everything in much greater detail, as well as the repo where you can find all the code.
And with this in place, we can actually start typing away and I think we'll start with our landing
page.