Day 24 of 50 Days of React: How to use Material UI in React?
Hi, Dev’s👋🏻, Let’s see How to use Material UI in React?
React community provides a huge collection of advanced UI component frameworks. Material UI is one of the popular React UI frameworks. Let us learn how to use the material UI library in this chapter.
What is MUI😍?
Material UI is an open-source React component library that implements Google’s Material Design.
It includes a comprehensive collection of prebuilt components that are ready for use in production right out of the box.
Material UI is beautiful by design and features a suite of customization options that make it easy to implement your own custom design system on top of our components.
Installation📝
Material UI can be installed using the npm package.
Visit: https://mui.com/
or:
Inside your React Project💻:
npm install @mui/material @emotion/react @emotion/styled// If you want to use mui icons
npm install @mui/icons-material
Advantages of Material UI📄
- Ship faster: thousands of open-source contributors have poured countless hours into these components. Focus on your core business logic instead of reinventing the wheel — we’ve got your UI covered.
- Beautiful by default: we’re meticulous about our implementation of Material Design, ensuring that every Material UI component meets the highest standards of form and function, but diverges from the official spec where necessary to provide multiple great options.
- Customizability: the library includes an extensive set of intuitive customizability features. The templates in our store demonstrate how far you can go with customization.
- Cross-team collaboration: Material UI’s intuitive developer experience reduces the barrier to entry for back-end developers and less technical designers, empowering teams to collaborate more effectively. The design kits streamline your workflow and boost consistency between designers and developers.
- Trusted by thousands of organizations: Material UI has the largest UI community in the React ecosystem. It’s almost as old as React itself — its history stretches back to 2014 — and we’re in this for the long haul. You can count on the community’s support for years to come (e.g. Stack Overflow).
In the Next Article, I will be writing about How to use AutoComplete of MUI in React🤔?
That’s all for Today, Stay Tuned and I will see you in the next one👋🏻.
Link to Day 25
Thanks for Following and Claps😋
