REACT JS - STYLE

material UI에서 withStyles라는 컴포넌트가 있다. HOC라고도 할 수 있겠다. style 객체를 넘기면 또다른 함수가 리턴된다. 그 함수에 스타일을 적용할 컴포넌트를 넘겨주면, style안에 선언한 스타일이 그대로 적용된다. 일단 코드로 보자!요렇게 적

공식문서에 의하면 custom MUI 컴포넌트를 만들기 위해 필요한 도구이다. 즉, 다시말해 모든 MUI 컴포넌트는 default로 styled 컴포넌트에 기반하여 만들어졌다.styled컴포넌트와 sx prop을 함께 쓰면 완전 독립적인 커스텀 MUI 컴포넌트를 만들

이번에는 다른 라이브러리를 소개해보려고 한다.내 개인적인 생각으로는 material UI의 styled보다 emotion이 더 편한것 같다. 왜냐면 hightlight, auto-complete 기능이 제공 되기 때문이다. 따라서 , camelCase로 바꾸지 않아도

MUI에서 제공하는 withStyles(HOC)로 함수 컴포넌트에 스타일링을 하려고 했으나 classes props가 전달되지 않았다. 공식문서를 보니 protoType에 추가해줘야 할 게 있었다.요렇게 하면 된다.근데 공식문서를 찾아보니 또 다른방법을 사용할 수 도

styled-components에 대해 작성해보려한다. 이때까지 mui , tailwind만 썼다가 styled-components에 대해서 적어보려한다. 이 것도 써보니 나름 좋드라 ㅎㅎ우선 App에 ThemeProvider context를 추가해준다. 그리고 pro

https://styled-system.com/api/#compose 참고해서 적기

npm install -D prettier prettier-plugin-tailwindcss하고 난 다음 아래 처럼 설정.