emotion대신 tailwind를 사용하는 이유가 뭔가요?

Question

이전 버젼의 강의에서는 emotion을 쓰고 본 강의에서는 tailwind를 쓰는데   저는 emotion이 가독성도 좋고 사용하기 편안하다는 느낌을 받았는데요 새로 생긴 강의에서는 tailwind를 사용하는 이유가 뭘까요?

노원두 · Answer

안녕하세요! 지성 님! react17 => react18버전으로 올라오면서, "서버컴포넌트" 란 개념이 생겼어요! 이 과정에서 폴더구조 셋팅 방식에 변경 이 생겼는데요! * 1) 앱라우터 방식: 신규 서버컴포넌트기반 방식(app 폴더) * 2) 페이지라우터 방식: 기존방식(pages 폴더) 문제는, 이 앱라우터방식(서버컴포넌트방식)에서 CSS-IN-JS(emotion, styled-components 등)의 호환이 어려운 문제 가 있어요! 따라서, 그나마 가장 CSS-IN-JS와 비슷한 방식으로 사용하는 CSS-Module (nextjs 기본 지원)을 채택 하게 되었구요! 이미 많은 회사에서 동일한 방식으로 사용중에 있답니다! 추가로, 이를 글로벌하게 공통적으로 처리하는 경우에 tailwind를 사용 하고 있답니다! (다시말해, tailwind를 메인으로 사용하고 있지 않아요!) 마지막으로, 모든 회사가 최신 앱라우터방식을 사용하는데에는 사실상 어려움 이 있어요. 특히나, 규모가 있는 회사들은 마이크로프론트엔드(MFE) 등의 기술을 사용하게 되는데, 이 역시 마찬가지로 앱라우터방식에서 호환이 어려우므로 페이지라우터를 사용 하는 경우가 많이 있답니다! (이 때는 여전히 CSS-IN-JS 방식이 적용 가능하므로, 최신기술에 너무 의존하는 것은 좋은 방법이 아니랍니다!) 넓은 시야로 궁금증을 가지며 공부하시는 것을 보니, 지성님의 깊이있는 성장이 기대되네요!^^