참고: 이 페이지는 next/image 컴포넌트의 API 참조 문서입니다. 기능 개요 및 사용 정보에 대해서는 Image Component 및 Image Optimization 문서를 참조하세요.참고: Next.js 13 이전 버전을 사용하는 경우, 컴포넌트 이름이 변
참고: Next.js 13부터는 (베타) app/ 디렉토리를 도입합니다. 이 새 디렉토리는 컴포넌트 수준의 공간적 데이터 가져오기를 지원하며, 새로운 React use hook과 확장된 fetch Web API를 사용합니다. app/의 점진적 적용에 대해 자세히 알아보
getServerSideProps 함수를 페이지에서 내보내면 (서버 측 렌더링), Next.js는 getServerSideProps에서 반환된 데이터를 사용하여 각 요청마다이 페이지를 사전 렌더링합니다. 이것은 자주 변경되는 데이터를 가져 오고 페이지가 가장 최신 데이
다이나믹 라우트를 사용하는 페이지에서 getStaticPaths라는 함수를 내보내면, Next.js는 getStaticPaths에서 지정된 모든 경로를 정적으로 프리 렌더링합니다.getStaticPaths 함수는 다음과 같은 필수 속성을 가진 객체를 반환해야 합니다.p
getStaticProps라는 함수를 export하면 함수에서 반환한 props를 사용하여 페이지를 빌드 시에 프리렌더링할 수 있습니다:getStaticProps에서는 모듈을 import하여 데이터베이스에서 데이터를 가져와 서버쪽에서 코드를 직접 작성할 수 있습니다.
어플리케이션의 모든 함수 컴포넌트에서 라우터 객체에 접근하려면, useRouter 훅을 사용할 수 있습니다. 다음 예제를 참고해주세요:useRouter는 React 훅으로, 클래스와 함께 사용할 수 없습니다. withRouter를 사용하거나 클래스를 함수 컴포넌트로 래
next/link로 클라이언트 측에서 페이지 이동을 할 수 있습니다.다음과 같은 파일이 있는 페이지 디렉토리를 고려해보세요.pages/index.jspages/about.jspages/blog/\[slug].js이러한 페이지로 링크할 수 있습니다.Link는 다음과 같은
이 API 참조 페이지는 Script 컴포넌트에 사용 가능한 props를 이해하는 데 도움이 됩니다. 기능 및 사용법은 Optimizing Scripts 페이지를 참조하세요.다음은 Script 컴포넌트에 사용 가능한 props의 요약입니다.<Script /> 컴포
우리는 페이지 head에 요소를 추가하기 위한 내장된 컴포넌트를 노출합니다:head에서 중복된 태그를 피하려면 key 속성을 사용할 수 있습니다. 이렇게 하면 태그가 한 번만 렌더링되도록 보장합니다. 다음 예제와 같이:이 경우 두 번째 <meta property=
next/server는 미들웨어 및 Edge API 라우트에서 사용할 수 있는 서버 전용 도우미를 제공합니다.NextRequest 객체는 기존 Request 인터페이스를 확장하여 다음과 같은 추가 메서드와 속성을 가집니다.cookies - Request에서 쿠키를 담은