Next.js(2)
-
[FE] Trouble Shooting - Next.js / FOUC, 화면 깜빡임 장애 해결
FOUC, Flash of Unstyled ContentSSR 시 스타일이 처음에 적용되지 않다가 나중에 적용되어 깜빡이는 현상 💥문제 상황좌측 상단에 보면 스타일이 뒤늦게 적용되어 UI가 깨지는 모습을 볼 수 있다Styled-Components로 스타일을 진행하였다 ❓원인 - Next.js 렌더링 방식 : SSR (Server Side Rendering) 1. HTML 렌더링 => Client 전달2. JS 렌더링 => Client 전달 👉🏻 Styled-Components : CSS-in-JS→ HTML 렌더링 후, Styled-Components의 JS 파일 적용 간 타이밍 이슈 발생 ❗해결 방법 - 서버에서 스타일을 미리 렌더링 : Next.js 공식 문서1️⃣Styled-Component..
2025.02.27 -
[FE] Next.js - export default vs export
Next.js로 작업 시 한 번쯤 왜?라는 의문이 생기는 부분이라 생각하여 정리하기로 했다. 오늘 주제와 관련하여 에피소드 하나가 있어 간략히 소개하고 시작하려고 한다.※ 하기 에피소드는 Next.js 없이 React만 사용하여 개발할 때의 이야기이다.작업하실 때 export default 쓰지 마세요. - Senior 개발자님 이유는 명확했다.나의 코드에서 export와 export default의 정확한 차이점을 모르고 쓰는 것이 보임1의 이유에 따라 export default를 사용함으로써 생길 수 있는 네이밍 오류 예방하기 위함첫 회사에서 받은 피드백은 꽤 큰 영향을 끼쳐 export default 혐오(?)증 까지 생겼었다.그런데.Next를 공부하니까 export default를 안쓰면 오류..
2025.02.11