_app.jsx(tsx) _app.jsx(tsx) 내의 컴포넌트는 모든 페이지를 렌더할 때 항상 호출됩니다. 그래서 모든 페이지에 필요한 공통 로직의 경우 App 컴포넌트에 추가할 수 있습니다. _app.jsx(tsx) 필요한경우 페이지 이동할 때마다 유지해야 하는 스타일이나 레이아웃 적용 페이지 이동할 때 유지해야할 state 관리 componentDidCatch 라이프사이클로 공통 에러 처리 페이지에 공통 로직을 통해 데이터를 주입해야하는 경우 모든 페이지에 필요한 css를 적용하는 경우 _app.jsx(tsx)의 site title tag site의 title 또한 _app.tsx에서 추가하는데 아래와 같이 next/head에서 Head 컴포넌트를 import해서 사용하면 됩니다. 동적 title이 필요할 때는 pages 폴더 하위에 개별 컴포넌트마다 title 태그를 추가하면 overwrite 됩니다. _document.jsx(tsx) Next.js에는 SPA에서 하나의 h…

Next.js 공식 getting-started 1. Next.js 프로젝트 설치 프로젝트 설치하기 설치 성공 Next js설치성공 2. Next.js 폴더구조 package.json Next.js에서는 또는, 로 프로젝트 개발을 시작할 수 있습니다. 명령어로 .next 폴더가 생성됩니다! 개발이 모두 끝난 후, production 용으로 빌드할 때! 명령어로 .next 빌드 폴더를 실행할 server가 시작됩니다. production 용으로 웹 서버를 띄울 때! 개발할 때는 만 실행하면 된다. 나머지 명령어는 배포할 시점에 사용한다. pages 🧑🏻‍🏫 pages 폴더에 있는 있는 파일이나 폴더는 곧 프로젝트의 라우트가 됩니다. ✔️ 라우트 설정 예를 들어 pages/mypage.tsx는 사이트 도메인에 /mypage 경로를 붙여서 접근할 수 있다. 동적 라우팅을 구현하고 싶을 때는 [대괄호]를 사용하면 되는데 pages/restaurant/[id].tsx로 파일을 생…