-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
해결됨
Next.js 스타일링 방식 결정
23.06.15 10:44 작성 조회수 420
2
Next.js 에서 스타일링을 하는 방법들이 다양한 것으로 알고 있습니다.
css-in-js도 제공하는 styled-jsx
아니면 재설정 해서 styled-component, emotion ..... 등등
프로젝트 스타일링을 scss, scss module로 결정하셨는데 혹시 이유가 있나요 ?????
답변을 작성해보세요.
0
박용주
지식공유자2023.06.15
안녕하세요 질문 감사합니다 :)
강의를 구상하는 과정에서, 대부분의 수강생분들이 편하게 받아들일 수 있는게 무엇일지 고민하다 내린 결정이었습니다.
리액트 컴포넌트에서 작성한 HTML tag와 개발자 도구의 DOM을 비교하면서 설명해야하기 때문에 css-in-js보다 HTML tag + className을 사용하는 게 좋다고 판단했습니다. (+ css-in-js의 성능적 overhead를 굳이 부담하고 싶지도 않았습니다.)
tailwind는 트렌디하지만 진입 장벽이 있어서 제외했고, styled-jsx는 긴 스타일 코드를 리액트 컴포넌트와 분리하고 싶어하는 개인적 취향으로 제외했습니다ㅎㅎ..
Next.js가 기본적으로 css module을 지원하는데, 그 사실도 알려드릴 겸 + 진입장벽/성능/관심사 분리/강의 방식 등을 종합적으로 고려하여 결정하게 되었습니다.
감사합니다!
답변 1