next.js 와 같은 react 기반 프레임워크 html 렌더링 부분에서 의문이 있습니다.

Question

지금 next.js(typescript) 기반으로 포폴 하나 만들다가 의문점이 생겨 글을 올립니다.React 같은 spa를 기반으로 하는 프레임워크의 경우 1회 렌더링, 즉 최초 어플리케이션이 구동하고 접하게 되는 첫 페이지 부분을 제외하고 나머지 페이지는 변동되는 부분만 다시 렌더링한다고 이해하고 있습니다.제가 이해하기로는 기본 프로젝트 구조가,app에서 구동되면서 최초로 생성되는 페이지(index or home.tsx) 이후에는 다른 페이지나 동일 페이지라도 변동사항이 있을 경우, 해당 부분만 재렌더링이 발생(바뀌어야 할 부분만 바뀜)하고 브라우저 상에 로딩된 첫 페이지 자체가 다시 그려지는 것이 아니라고 이해를 하고 있어요. 예를 들어,

첫 페이지최초 페이지가 이렇게 있을 경우,다른 페이지로 가게 되더라도 제일 상단에 감싸고 있는 저 html 부분, 즉 내용물만 바꿀 페이지는 1회만 렌더링 할 것이기에아예 최초 생성되는 프로젝트 구조에서 별도로 빠져서 구현이 되어 있고,이후 다른 페이지에서 html 태그를 포함해서 리턴을 하게 되면, 컴파일에는 이상이 없으나, 브라우저에서 에러가 나면서 터지게 되더라구요.갑자기 제가 이해를 하고 있는 방식이 올바른 것인지에 대해 의구심이 생겨서 질문을 올립니다.

Hee Sung Son · Accepted Answer

리액트의 경우에는 spa만 지원함으로써 필자님이 이해하신 대로 진행되지만 next.js같은 경우에는 isr , ssr, ssg 방식과 최사 app폴더를 이용하실경우 server component우선 렌더링이 적용되어 각 방식마다 렌더링 차이가 있지만 원한다면 페이지마다 header를 변경할 수 있습니다

next.js 와 같은 react 기반 프레임워크 html 렌더링 부분에서 의문이 있습니다.

1개의 답변

기술 목록