In the last video we generated our new project.
So I'm not going to change into that new translate folder.
I mean to start up my code editor inside there and then I'll start up my development server with NPM
start.
All right.
So that's going to start of my application.
I'm going to open it up inside my browser member local history thousand and we'll see the full application
appear inside my code editor.
We're gonna go through the typical setup that we go through in just about every application we've put
together so far.
So I'll find my SIRC directory.
I'm going to highlight all the files inside there and delete all them all then create a index file inside
the SIRC directory.
Then inside of here I will import re-act from re-act import Riak Dom from re-act Dom I will import my
app component which will create in just a moment from component's app and then I'll do my usual re-act
Dom render and I'll pass an app with document data queery selector pounde root like so.
All right.
Let's now find our SIRC directory.
Inside there is going to make a new folder called component's inside the compounds directory.
I'll make a outtalk J.S. file and inside of here I will import re-act from re-act and then I will make
a class app extends re-act component or define a render method that will return a div that simply says
app and then I will export default app at the bottom like the net will save both these files and they'll
flip back over to my browser and just make sure I see the text app appear on the screen.
Very good.
Next up we're going to wire up semantic UI we're using semantic UI because that's what's going to get
these actual flags to render on the screen.
So as usual I will google semantic UI CDN on this page.
Search for semantic men and you'll find the Minot's CSSA file right here.
I'll copy the link.
I'll find my public directory.
Open up the index at each file and I'll put my link inside of here.
So link rel style sheet Tref and then copy in that link like so.
And don't forget to close off the link tag.
All right so we'll say this really quick.
I'll flip back over to my browser and I should see that slightly formatted text appear.
Now something we have ran into many times was the root class name on this component.
Second to add that in right now.
I'll simply say UI container like so and then if I save this I should see my app kind of just move in
just a little bit on the screen.
OK so that's a good place to get started.
We'll take a quick pause right here when we come back in the next section.
We're going to start building the actual language selector inside the app component.