https://fe-developers.kakaoent.com/2022/221013-tailwind-and-design-system/
참고하였습니다
CSSINJS 의 재발견
- 어찌됐던 CSS의 탈을 쓴 JS 이기때문에 로딩이 있을수있다 (버그성깜빡임)
- styled 칸이 길어질수록 코드 칸이 길어져서 오히려 가독성을 해칠수 있음
- 비슷한 페이지의 공통 디자인을 뭉치기가 어려울 수 있음 =>
themeProvider 를 사용할경우 거의 모든 컴포넌트의 보일러플레이트가 될 수 있음.
TAILWIND의 재발견
- IntelliSense 이 된다. 생각해보니 타입스크립트 자동완성으로 굉장히 편리함을 느꼈었으니...
- 빠르고쉬운 반응형 / 레이아웃 잡기 디자인 통일성
그치만 tailwind의 디자인이...
프론트입장에서 테일윈드의 디자인은 너무 평범하고 성격상 뜯어고치고 내것으로 만들고싶기 때문에 알아본결과
twinmacro 라이브러리를 이용해서 cssinjs(나같은경우 스타일드컴포넌츠)와 함께 이용하면 어느정도 고민이 해결된다.
컴포넌트별 UI 는 CSSINJS 로잡고 pr전체적인 서비스의 틀(레이아웃,컬러가이드)은 테일윈드로 빠르게 잡아 작업기간을 줄일수 있을것이다.
또 동적으로 컨트롤해야하는 부분은 twinmacro 로 처리해서 cssinjs 의 큰 기능인 props 로 받아오는 동적 스타일도 커버가될수있다..
It's the smurf smurf smurf!