The case of first steps would be to set up our environment and put this we're just going to go through
and also set up a few technologies that we're going to use.
So we need a font awesome for our icons.
So for you also, this icon right here, this book icon and for this icons down here.
So you need to go to font.
Awesome.
Create a account.
If you don't happen, you could also go to Google and search for font.
Awesome.
See the city and, uh, link and actually link it up without creating account.
Sometimes that works, sometimes it doesn't.
But I would suggest to create the font.
Awesome free kit and you just go to your account right here and then click on your name across and give
it the name.
Let's give it the name, its name it.
Q The name of my kit.
And yeah, so actually, all that you need to do, so ten years ago, he changes have been saved and
this is your link right here.
OK, so you just need to copy this.
And I already created the empty folder in our project.
And I'm just going to create an index that each demo.
Now, shift exclamation mark boilerplate and right above our title, I'm going to paste in our kit.
So this is just a short link which will link up font awesome to our Web page that each time we're going
to use a a icon, this is how it's going to communicate with it.
Next up, let's go to our next technology, which will be Google fonts.
We're going to use from Google fonts.
I actually used the font of one serried the search for it up here.
Going to just search one T.
And one third click on it, and I chose I have chosen this thing, start right here, so click on Selected
Style, then this will pop up and we need to import it all.
You could also use the link, but I usually import this.
So I think that is between the style brackets.
The style tags, we can just copy this, like click copy.
Go back to our project and we need to pace it now into a ceasefire, so let's get the style, the ceasefire
link pasted in right here and also link up access.
So let's go down here right above our title and type in link and style that access.
Now, let me also open this up.
So I'm using lipservice just right click open with, like, server on our index and we'll have this
blank page.
Now, let me actually rearrange them.
So I want you to be there by.
Now, let's type in here the actual title, each one titles just show that this is working now another
type of tag.
H1 and New Peterloo, whatever, just focus on purpose.
OK, so they we have a low and if I were to comment out.
M. o, we also need to import it after we imported.
We also need to.
Tell it where to be applied, so you see this one firmly on the right side.
You could either copy this or just type it into etched into our success, going to copy it, and I'm
going to apply this to the entire body.
So I'm going to take the body tag and tell it to your fun.
Family should be monitored.
So we do this and go back to our Web page.
Is this your Hadlow?
OK, so the style just change.
Right, so let's move on and, um, yeah, next up, we need to take a look now at the images we're
going to use on Splash that this is just a free image, depositary, some sort.
We are not going to use the images but down and then we are actually going to use their links.
So try to link up a image through this website.
And for this, we're going to use this URL.
So you're going to need to go to source dot on splash dot com, which actually going to compare this
in a case against hit.
So images would be from the storm hit a comment source for images is this one source source dot and
splash dot com.
And from here we just need to copy.
This you are exactly as I did right here.
So this is the euro and let's say I'm going to this just example, I'm going to take that image, take
paste this euro in, and as soon as I do this, we're going to go to a Web page.
OK, we already have now an image to just check.
One hundred fifty.
That's good.
Now, this is a random image.
If I refresh, it's going to change your case.
Each time we refresh, we're going to get a different image.
So if he wants some specific images, let's go now to splash dot com and we can search here for.
Just think I searched for media media made up of maffia media.
OK, and here, for example, one of our images which we have in our.
Finnish website and this actually this image, so how can you obtain this image?
Well, we can click on it and we could either download it and use it as an image.
Vibora said that we are going to use a link.
So this right here.
After the photos is the I.D., I'm going to copy this, go back into our code and instead of random,
I'm going to replace it with our I.D. So as soon as I hit Save, go back to our images.
To our website, there we go, there's our image, and each time I refresh, it's going to stay the
same because now it has decided it's all always going to use this image.
All right.
So next up, let's go into our access and do try to do some general resets.
So let's do star.
And I said, let's reset the margins and actually I want to not only the general reset, but I want
to reset everything.
That's, for example, using a pseudo satellite before and after.
So before comma after.
I don't need this right here.
So everything will be reset with a margin of zero and padding of zero.
Now, we already have a body done, so the last thing I want to do is take out all of our anchor tags
and our ally tags and set their lifestyle to none.
And our tax declaration
to none.
And as you may know, not just means that I'm going to use a list item in an order the ordered list,
it will not have those Dischord numbers.
And also when I create a link tag, so I'm going to use the anchor tag, it will not be on the line.
And actually the color will be different.
But I can manipulate Baydon, put that on the line will not happen.
Okay, so that's almost it.
I just want to create in our e-mail a bit of a map of what we're going to do.
So we're going to create a main
this is going to also have a idy.
I think they're in their.
Of men and women, I mean, we have a weather section and I'll know after I had a section, will have
the images or the sections four for our section right here for our services.
OK, OK, so let's do this by creating a song right after Heather, we're going to create a section
and we're also going to create a list of our section.
And I'm going to give this the idea of Section nine after our section.
I'm just going to type in here title with each to and this is going to have the idea of Section Desh
title.
Not here, but here.
OK.
So this is actually where all of our services will live.
And after all, services will have to actually I mean, we'll have our photo section now, as I said,
and within a photo, we're also going to have our contacts are hoping that the photo will contain it
will be just a contact session.
We're going to give this the idea of contact.
All right, so that's it for this video throw out out.
I want to do next up.
So let's go to the next one.
See you soon.
Bye bye.