NextJS 13+

본 시리즈는 넥스트 13버전이후의 개념정리 및 공부내용을 담고 있다. 먼저 넥스트가 무엇인지 왜 사용하는지에대한 글은 NextJs 기초를 참조하자.

폴더기반 자동 라우팅새로 디자인한 서버API기능쉬운 DB연결직관적인 렌더링 전략 선택기능hydration없는 server-side rendering파워풀한 캐싱이미지&폰트최적화회원인증 기능리액트 라이브러리 신문법인 Client component와 server compo

라우팅 처리를 알아보기 전 app전체의 구조를 살펴보자.routing: 페이지를 나누는 것보통 웹사이트들은 url을 이용해 페이지를 구분해 놓는다. 예를 들어 벨로그같은 경우는 https://velog.io/@gyultang으로 접속하면 gyultang의 벨로

웹사이트를 만들 때 이미지는 대부분 필수불가결적으로 들어간다. 보통 이미지를 넣는방법이라하면 public(공통)폴더에 보관하고 필요한 페이지에 img태그로 넣으면 된다.Next/Image 컴포넌트에서 제공하는 대표적인 기능 3가지이다.lazy loading: 이미지 로

리액트18버전 이전까지는 리액트를 사용하여 어플리케이션을 렌더링하는 주요한 방법이 전적으로 클라이언트에 있었다. NextJS는 HTML을 생성하고 리액트에 의해 hydrated되도록 클라이언트에 전송함으로써 어플리케이션의 pages로 나누고 서버에서 PreRender하