next.js사용중에 css,html요소 렌더링이안됬다.

1.

next.js를 사용중에 css적용과,html요소 렌더링이 안됬다.
요소를 추가하고 css를 새롭게 적용시킬때마다 서버를 껏다 키고, 사이트를 새로고침해줘야 제대로 적용이되었다. Ex)

// 기존html요소
<div>요소1<div>

// 내가 하드코딩해서 추가한 요소
<div className='red'>요소1 <span>제목</span><div>

2

해결은 간단했다.
위의 적용이안되는 페이지는 클라이언트 컴포넌트였는데,
여태 서버컴포넌트를 사용하다보니 페이지의 대소문자를 구분 안해줬었는데 클라이언트컴포넌트는 대문자로 작성해줘야 서버가 실시간으로 알아듣고 반응을 해주는거였다.

// 내보내고
export default Comment;

// 불러오고
import Comment from './Comment';