유리의 개발새발

나는 Page Router고 App Router고… 둘 다 모른다. 그래서 다행이다 😊Next.js를 막 공부하기 시작했는데,"Page Router vs App Router" 라는 말을 듣고 당황했다.뭐가 뭔지도 모르겠는데, 사람들이“이게 더 낫다”, “이건 미래다”, “아직은 이게 더 안정적이다”… 말이 너무 많다.근데 사실,나는 둘 다 몰라서 그냥 처음부터 동시에 배우면 된다.Page Router란?현재도 많은 기업에서 사용 중인, 가장 안정적이고 검증된 라우팅 방식입니다.pages/ 폴더를 기준으로 파일 이름 = 경로(URL)예를 들어 pages/about.tsx → /about 경로로 자동 매핑getStaticProps, getServerSideProps 등으로 페이지 단위 데이터 패칭 지원_a..

Next.js에는 자체 라우터가 있습니다Next.js는 React 기반의 프레임워크답게, 별도의 라우팅 라이브러리를 설치하지 않아도 됩니다.그냥 디렉토리만 잘 구성하면 끝. 하지만 여기서 헷갈리는 개념이 하나 있죠.Next.js에는 Page Router와 App Router, 두 가지 라우팅 시스템이 있습니다.Page Router (기존 방식)pages 디렉토리 기반Next.js의 기존 라우팅 시스템 (Next 12 이하에서 기본)파일 기반 라우팅: pages/about.tsx → /aboutgetStaticProps, getServerSideProps 같은 데이터 패칭 함수 사용_app.tsx, _document.tsx, _error.tsx 같은 특수 파일로 전체 구조 설정📌 장점: 단순하고 익숙함 ..

이제는 진짜 웹도 해야 할 때가 왔다앱만 하다 보니 문득 이런 생각이 들었다.“웹은 대체 언제 하지...?” 예전에 CRA(Create React App)로 몇 번 만져보긴 했지만 요즘은 다들 Next.js를 쓴다고 하니…나도 이제 슬슬 공부 좀 해봐야겠다 싶었다. Next.js란?https://nextjs.orgNext.js by VercelThe React Framework for the Web풀스택 웹 애플리케이션을 위한 React 프레임워크Next.js는 웹을 위한 React 프레임워크이며,React로 UI를 만들고, Next.js로 기능과 최적화를 더하는 구조입니다.프레임워크 vs 라이브러리프레임워크라네요?그 말은 곧…주도권은 이제 내 손을 떠났다는 얘기겠죠.라이브러리는 내가 필요한 기능만 골라..