A Great UI Library:MUI

MUI was called Material UI formely.It was indexed by the famous React Cookbook. By Using MUI,we can build React.js projects in Material Design Style.

Notice:

If you are in Mainland China,I srongly recommand you install the cnpm package manager by taobao to install packages quickly:

$npm i cnpm -g

Installation

MUI is a npm package,so please intall it by CLI:

$npm install @mui/material @emotion/react @emotion/styled #npm
$cnpm install @mui/material @emotion/react @emotion/styled #cnpm
$pnpm add @mui/material @emotion/react @emotion/styled #pnpm
$yarn add @mui/material @emotion/react @emotion/styled #yarn

Material UI uses the Roboto font by default. Add it to your project:

$npm install @fontsource/roboto
$cnpm install @fontsource/roboto
$pnpm add @fontsource/roboto
$yarn add  @fontsource/roboto

You can also use the Google Font CDN.

Notice:
Google Font CDN is not avalivable in Mainland China.Use the link below to access the Google Font CDN in Mainland China:

@import url('https://fonts.font.im/css?family=Roboto');

Usage

Import them in ES moudles:

import { Box, Typography, Grid, Card, CardMedia, CardContent, CardActions, Button } from '@mui/material';

You should just import compeonents you need to save the loading time.

For more info, go to https://mui.com ,Choose the Docs → Material UI in the navbar.