Exploring JavaScript Libraries
MUI Tabs are a handy component for easy navigation with out-of-the-box styling. However, sometimes that styling is more than we need. In this Tab Panel example, we will disable the indicator (the underline at the bottom of the Tab just above the shadow) and instead add our own styling. We will style Material-UI’s Tabs with … Read more
The Material-UI Accordion (previously known as the expansion panel) is commonly used for controlling when secondary components or information is displayed. In this example, we will build an Accordion that has components nested in both the summary and details sections and discuss the different components that compose an Accordion (AccordionSummary, AccordionActions, AccordionDetails). We will also … Read more
The Material-UI List component is handy because it has lots of out-of-the-box functionality. Take a look at the following API’s the List examples in the docs hook into: However, finding example beyond the docs, or simply understanding clearly how to use some of the customizations, can be challenging. In this demo we use the Checkbox … Read more
The Material-UI Select component creates a slick menu for users to choose from a list of options. The standard Select uses a dropdown (created from a Popover component) and the native Select uses the html option element. Both of these variations of the component can have checkboxes enabled. The standard Select can easily have checkboxes … Read more
The Material-UI Drawer component is an essential layout component for everything from navigation links to informational sidebars. In this React MUI Drawer example, we will make a mobile responsive Drawer component that is always visible on screen sizes > 375px, and on smaller screens it opens and closes with the click of a menu icon. … Read more
React-Router is a highly popular routing library. As of the beginning of 2021, it has more than 4 million weekly downloads: One of the core pieces of react-router is the Link component. This versatile component has props for customizing routing, passing routing params as objects, styling, history, and more. Let’s build an app that demonstrates … Read more
