4. Creating Navigation Bar

mui AppBar
https://mui.com/

MUI: The React component library you always wanted

 
use fields from routes.tsx to add headers and on click nav functionality 

{routes.map((r) => (
              <Button
                key={r.navName}
                onClick={ () => {
                    handleCloseNavMenu();
                    navigate(r.path)
                }}
                sx={{ my: 2, color: textColor, display: 'block' , fontSize: '25px'}}
              >
                {r.navName}
              </Button>

 
Progress