[React] Deep Dive 모던 리액트(28) Next.js13 라우팅

Next.js 13버전은 Next.js의 역사를 통틀어서 가장 큰 변화가 있었다. 서버사이드 렌더링의 구조에 변화가 많은 리액트 18을 채용하였으며 레이아웃 지원또한 본격적으로 지원하기 시작했다. 또한 바벨을 대체할 러스트기반 SWC를 뒤이어 웹팩을 대체할 Turbopack까지 출시했다! app 디렉터리 Next.js의 아쉬운 점으로 평가받던 것 중 하나로 레이아웃의 존재가 항상 지목되어 왔었다. 공통 헤더와 공통 사이드바가 대부분의 페이지에 필요한 웹사이트를 만든다고 생각해보자. 만약 react-router-dom을 사용한다면 아래와 같은 방식으로 라우팅을 만들어 볼 수 있다. import { Route, Routes } from 'react-router-dom'; const App = () => { ..