All language subtitles for 2. Project Setup

I've now finished generating my new project inside my workspace directory.

If I list out all my files and folders again.

I'll see a new directory inside of you're named after a project called card's going to change into that

folder and then start up my development server again.

Remember we can start that up with either NPM starts or end G serve either one.

Totally fine.

I've also gone ahead and started up my code editor at the same time though I've opened up my code editor

inside this new card's project directory.

I closed my old editor where we were working on the password generation app so we're going to be working

entirely inside the card's folder from now on.

The first thing I think we need to take care of is figure out these styling side of our application.

Reason I say that is that it's very clear that we've got a certain goal on this.

C Ss or styling side.

I think that if we start to attack the C Ss right from the get go we'll end up with a really good looking

application and it will not require you to copy paste in a lot of each team mail at the very end as

we did in the last application.

Let's go through the process of wiring up that Boehner CSX library.

Once again before we do so I want to pull up the Alabama documentation really quickly.

Remember you can get there at all my dot I O once here.

I'll find the documentation on the top left hand side and then on the far right hand middle.

I'll find the section that says components inside there is a subsection called cart.

If I go to card we'll see something that looks like this right here.

And so I'm sure you'll notice that this looks very similar to what you and I are trying to build right

now.

The image at the top.

A title username and some content but all we have to do is essentially get this style of H2 email into

our application along with Boma and we'll get something that looks like this.

We're not going to use exactly this h t email because you'll notice that this little example right here

has the extra little place holder image.

This also got some links and a date at the bottom that we don't need as well.

We're gonna use something very close to this but not quite exactly the same.

All right so let's go back over to our terminal.

We're going to install Bouma into our project and then we're going to link it up inside that Stiles

Nazi SS file.

Once again lol first go to my terminal.

I'm going to once again open up a second terminal window inside my card's project directory and I'll

run npm install Wilma after that is all done.

I'll go back over to my code editor and we'll make sure that we add that import statement inside of

our styles Nazi SS file just as we did a moment ago.

Go inside my cards project directory I'll find the SRS folder inside there is styles Nazi SS and once

again inside of here we'll do at import Omar the SS former Nazi SS well so we'll save that.

Let's then go back over to our browser and open up a new tab to visit our application.

We'll go back over to my browser open up a new tab and navigate to a local host colon.

Forty two hundred.

Once again once we go here we're going to see the welcome page again as we had seen previously.

We're going to notice that some of the styling on this page looks a little bit messed up.

That is because the styling that is included in these starter application is now conflicting with the

bonus the SS that we just added that is totally fine because remember we're going to remove all that

defaults the SS in just a moment.

Okay so now we've got a good starting point here.

We've got Walmart we've got our project generated we'll come back in the next video and start writing

out some each team out to create these different carts.