Beautiful.
And once we have the bare setup in place now, it's enough where we'll place a logo and right next to
it.
There's going to be some going up there with few classes that will add for styling and then in there
set up hitting one with a name, maybe a little bit of text, as well as button that eventually will
navigate your way along and register.
Once we set up the reactor or not at the moment.
And then right next, that will place our main image.
So let's go back here.
As far as my main return, I think I'm going to go with main tags and I want to place the logo in the
nav.
So let's go here with nav.
So now element.
We're not going to add any classes for now.
We're just going to go with image than for the source.
We want to look for a logo online for alternative.
Let's just write job five.
And then we also want to add a glass of logo.
So let's say here, class name now will be equal to your logo.
Again, there's going to be no styling at the moment since we haven't started using style components,
but we should say something on a page then right next to it.
Like I said, there's going to be a there.
We have the main content, so I'm going to create a name for the class of container and page.
Now container comes from the global glasses.
Let's just set up the width.
Pretty much that I can use in any component.
And there's also going to be a page glass that we use in our style component of an inside of it.
We have two columns.
Effectively, we have one column where we have all the info.
And in the other column, we're going to have our image, so therefore inside of the container, we'll
start with info first in line for the info we want to go with anyone.
Let's just say job and add a little bit of styling showplace, a Spanish side sidetracking here.
And then right next to it, let's say up.
Let's say that again, there's no styling.
So at the moment it's going to look somewhat ugly.
One i30 think one.
We want to go with paragraph and usually I use.
Hipster ipsum.
So if I go here with hipster.
Ipsum, that's a text that I use, but you can always use just regular lorem as well.
So I go here with whatever paragraphs and then I just pick.
Whichever text I want in this case, I think I'm going to go with this one.
So inside of this paragraph, I'm just going to set it up.
And then lastly, like I said, there's going to be a link that goes back to a register page.
But at the moment, we haven't covered React router, so I'll just start simply by creating a button
that will turn this into a link.
And here we have two classes.
We have the global median class.
And we also have between hero and as far as the name, let's just say logging.
And register.
So once we set this one up, only thing that's missing here is side by side with this there with this
info.
And you know what?
Let me add a comment here.
Let me say here info and not right next to it or place our image because again, there's going to be
a two column layout on the big screen.
And in fact, on a small screen, if you looked at the job before I went on the phone, you noticed
that there's actually no image.
So this image we're actually displaying only once we get to the big screen.
So right next to our info, Dave, we want to go here with second image and here we on display main.
And as far as the alternative, I'm going to go on job hunt.
And let's add some classes here as well.
Let's just say I am.
So this is pretty much a global image class that I'm using.
And then I also want to add main image because again, it will will be showing and hiding this particular
image on different screens.
And once we are done with the basic set up and once we have our sample return.
Now let's talk about the styling that we're going to use throughout the project.