커스텀 App과 Document
지금 페이지에는 Header라는 컴포넌트와 Container라는 컴포넌트가
모든 페이지에 공통적으로 적용되어 있다.
이 공통된 컴포넌트를 지워주겠다.
(index.js, search.js, setting.js 등등)
1. 공통된 부분을 _app.js에다가 추가할 것이다.
이 파일에는 App이라는 컴포넌트가 있다.
여기에 코드를 작성하면 모든 페이지에 공통이 되는 부분을 적용할 수 있다.App컴포넌트는 컴포넌트라는 prop을 받아서 렌더링한다.
이 prop은 Next.js 페이지라고 보면 된다.
그래서 컴포넌트로 렌더링하고 pageProps라는 것을 내려주고 있다.
2. Fragment로 감싼 다음에
Header와 Container컴포넌트를 추가한다.
3. _document.js파일에는 Document가 있는데
html의 뼈대를 만드는 용도이다.
Next.js에서는 서버에서 렌더링할때만 이 컴포넌트를 실행하고
클라이언트 사이드에서는 이 컴포넌트를 실행하지 않는다.여기서는 html태그의 lang 속성을 바꾼다거나
사이트 전체에 적용할 html태그를 추가하거나 할 수 있다._document.js에서는
useState, useEffect와 같은 인터렉티브한 동작을 사용할 수 없다.
