MUI란?

리액트 UI 라이브러리
antd, react-bootstrap, material-ui(mui) 등이 존재

MUI는 리액트 라이브러리 중 하나로
MUI는 구글의 디자인 철학인 Material Design을 구현한 자바스크립트 라이브러리이다.

materialUI라고 불리던 MUI는 5버전으로 리뉴얼 되면서 기존의 materialUI라는 이름을 버리고 MUI라는 이름으로 바뀌었다고 한다!

3글자로 줄이고 나서 MUI는 "이는 개발자 경험(DX)의 개선"이라고 말했다고 합니다.

Materail-UI 조직을 MUI라 칭함
Material-UI MIT 컴포넌트 셋-> MUI Core
Materail-UI X 고급 컴포넌트 셋-> MUI X

MUI와 MUI Core로 이름을 구분하는 것은 라이브러리 자체와 개발 그룹을 구분하는 것이 의미 있다는 것을 말한다.

기존 4버전에서는 material의 컴포넌트와 jss를 접목시켜 작동하는 구조였는데 5버전부터는 emotion을 접목시켜 보다 더 styled 컴포넌트에 가까워졌다.
emotion은 Javascript로 Css 스타일을 작성하도록 설계된 라이브러리이다.

기존에는 useStyles와 makeStyles를 이용하여 hook을 이용한 스타일 기능을 적용시켰다면 이제는 styled 컴포넌트 처럼 styled와 컴포넌트 안에 내장된 sx를 사용하여 작업한다.

MUI 공식 문서는 아래 링크로 접속하여 확인하세요
MUI 공식 문서