서버 사이드 렌더링

Next.js 13app 디렉터리 등장/pages로 정의하던 라우팅 방식이 /app 디렉터리로 이동함파일명으로 라우팅하는 것이 불가능해짐 => 폴더명까지만 주소로 변환됨layout.js페이지의 기본적인 레이아웃 구성하는 요소해당 폴더에 layout이 존재하면 그 하위 폴더 및 주소에 모두 영향을 미침주소별 공통 UI 포함할 수 있음_app과 _document를 대신해 웹페이지를 시작하는 데 필요한 공통 코드를 삽입할 수 있음단, layout예약어를 필수적으로 사용해야 함children을 props로 받아서 렌더링 해야함page.jslayout을 기반으로 위와 같은 리액트 컴포넌트를 노출함error.js해당 라우팅 영역에서 사용되는 공통 에러 컴포넌트특정 라우팅별 서로 다른 에러 UI를 렌더링할 수 있음에..

싱글 페이지 애플리케이션(SPA, Single Page Application)렌더링과 라우팅에 필요한 대부분의 기능을 서버가 아닌 브라우저의 자바스크립트에 의존하는 방식최초에 첫 페이지에서 데이터를 모두 불러온 이후에는 페이지 전환을 위한 모든 작업이 자바스크립트와 브라우저의 history.pushState, history.replaceState로 이뤄지기 때문에 페이지를 불러온 이후에는 서버에서 HTML을 내려받지 않고 하나의 페이지에서 모든 작업을 처리함사이트 렌더링에 필요한 내부의 내용을 모두 자바스크립트 코드로 삽입한 이후에 렌더링함페이지 전환 시에는 새로운 HTML을 요청하는 것이 아니라 자바스크립트에서 다음 페이지 렌더링에 필요한 정보만 HTTP 요청 등으로 가져온 다음, 그 결과를 바탕으로..