All language subtitles for 1. Section 3 Intro material-ui

We've done a great job now of getting our header set up but it's time to start adding some extra functionality

to it.

We'll start off by working with the menu component from material UI which is going to allow us to add

a pop over menu.

The little pop up hover menu that you'll see commonly in app bars to display other tabs.

And we're going to go ahead and add a hover menu on the services tab to display or other services giving

us a link to them directly which will also include managing which of those menu options is selected

after that.

Of course the next step is to make our header responsive using material you eyes responsive design system.

And with this approach we're going to change from a tab based navigation structure for desktop to the

menu based navigation structure for mobile and going through that process I think is really going to

teach you guys all of the basics for Responsive design in material UI that we're going to use throughout

the rest of the course.

That way when we get to setting up complex layouts and other structures you're gonna be a lot more familiar

with the process and it won't seem quite as crazy to you.

Lastly once the application is responsive and knows when or when not to display the tabs well then we'll

need to add something to replace the tabs which we will do with the drawer component.

The drawer is actually also going to contain the list component and we'll be using this for our mobile

navigation structure instead of the tabs that is used on desktop like the menu will also need to keep

track of which item in the drawer we have selected.

And once we finish up the draw then our header should be entirely finished and you'll really see the

beginning of a very polished application.

So let's go ahead and get on into the next section to keep adding some functionality to our header.