인프런 커뮤니티 질문&답변
작성한 질문수
styled components 스타일이 약간의 딜레이 후에 적용되는 현상
해결된 질문
작성
·
187
0
알찬 강의 할인해서 잘 들었습니다. 제로초님 ㅎㅎ
강의 다 듣고(람다는 나중에 들을게요 ㅎㅎ) 개인 프로젝트 해보려고 하는 중 질문드립니다.
더미데이터로 우선 디자인 잡고 있는 중인데, 넘어가려 했다가 신경쓰이는 부분이 있어 여쭤봅니다.
제로초는 노드버드 강의와는 다르게 처음부터 ant design과 styled components를 함께 사용해서 디자인하고 있는데,
처음에 페이지 불러오거나 새로고침시, ant design 이 먼저적용되었다가 약간의 시차를 두고 styled components가 적용되는 현상이 있습니다.
왜 이런 현상이 일어나는것인지 궁금하고 어떻게 해결할 수 있을지 알고싶습니다.
강의에서처럼 나중에 styled componentsr가 SSR로 적용이 되게 해주면 해결되는 것인지요?
답변 2
1
네 styled components가 SSR 적용되게 해주셔야 합니다. 이게 SSR이라고 해도, SSR이 적용되지 않은 패키지들이 있다면 브라우저에서 렌더링이 한 번 더 일어납니다. 이 현상이 일어나는 이유는, 기본적으로 SSR을 적용하지 않으면 componentDidMount같은 곳에서 화면을 조작하는데, SSR을 적용하면 여기의 작업을 서버에서 처리합니다. (SSR에서는 componentDidMount의 존재를 모릅니다)
0
_document.js 생성해서 styled components가 SSR시 적용되게 해주어야 하는 것을 하지 않았었네요. 강의에서 이 파트 후반부에 있어서 간과하고 있었습니다. 답변 감사합니다!