Next.js는 서버 측 렌더링을위한 React 프레임 워크입니다., 생성자가 React 애플리케이션을위한 제로 구성 단일 명령 도구 체인으로 제공합니다.
이 프레임 React 프론트 엔드 애플리케이션을 쉽게 만들 수있는 공통 구조를 제공합니다. 서버 측 렌더링을 투명하게 관리합니다. Next.js 버전 9.3은 월요일에 새로운 기능과 일부 개선 사항을 포함하여 출시되었으며,이 중 정적 사이트를 생성하는 기능을 주요 참신함으로 찾을 수 있습니다.
Next.js 9.3의 새로운 기능은 무엇입니까?
Next.js 9.0이 출시되면서 프레임 워크는 정적 자동 최적화 개념을 도입했습니다. 때 페이지에 차단 요구 사항이 없습니다. getInitialProps와 같은 데이터 복구, HTML로 자동 렌더링됩니다. 일단 만들어지면.
데이터 추출 요구 사항을 차단하더라도 컴파일 타임에 정적 HTML로 페이지를 만들고 싶은 다른 경우가 있습니다. 예를 들어 마케팅 페이지의 경우입니다. 콘텐츠 관리 시스템 (CMS)에 의해 구동됩니다.
Next.js 9.3은 두 가지 새로운 데이터 복구 방법을 소개합니다.: getStaticProps 및 getServerSideProps.
이러한 새로운 방법 getInitialProps 모델에 비해 많은 이점이 있습니다.SSG (Static Side Generation)와 SSR (Server Side Rendering)이 될 것은 분명한 차이가 있기 때문입니다. API 추가입니다.
모든 새로운 기능은 이전 버전과 호환되며 점차적으로 채택 될 수 있습니다. 감가 상각이 없으며 getInitialProps는 계속 정상적으로 작동합니다. 동적 라우팅을 얻기 위해 getStaticPaths 매개 변수가 추가되었습니다.
- getStaticProps : 구성 중에 데이터를 얻을 수 있습니다.
- getStaticPaths-데이터 기반 동적 라우팅을 지정합니다.
- getServerSideProps : 각 요청에 대한 데이터를 가져올 수 있습니다.
이 새 버전에서 눈에 띄는 또 다른 변경 사항은 미리보기 모드에 대한 지원입니다. getStaticProps 소개 Next.js에서 새로운 가능성을 열어주고 특정 조건에서 요청시 Next.js 렌더링 기능을 사용하는 것과 같은.
예 초안을 미리 볼 때 CMS에서는 정적 렌더링을 건너 뛰고 초안 컨텐츠로 주문형 페이지 렌더링 게시 된 콘텐츠 대신. 이 특정 경우에만 Next.js가 정적 빌드를 건너 뛰기를 원합니다. Next.js 팀에 따르면 미리보기 모드를 사용하면이를 수행 할 수 있습니다.
모드 미리보기를 통해 사용자는 생성 된 페이지를 건너 뛸 수 있습니다. 정적으로 요청시 (SSR) 초안 페이지를 반환합니다 (예 : CMS에서). 그러나 특정 CMS 시스템에 국한되지 않습니다. 미리보기 모드는 getStaticProps 및 getServerSideProps와 직접 통합되므로 모든 유형의 데이터 복구 솔루션과 함께 사용할 수 있습니다.
Next.js 9.2는 내장 CSS에 대한 지원을 추가했습니다. 그러나 Next.js 9.3은 Sass에 대한 지원을 추가했습니다. 전역 스타일 시트와 CSS 모듈은 물론 임베디드 CSS도 지원됩니다. Next.js는 이제 Sass 파일이있는 CSS 모듈을 지원합니다. 파일 명명 규칙 [name] .module.scss를 사용합니다. 이전에 Next.js 5+에서 next-sass와 함께 사용할 수 있었던 지원과 달리 이제 전역 Sass 및 CSS 모듈이 공존 할 수 있습니다.
모듈 CSS를 사용하면 고유 한 클래스 이름을 자동으로 생성하여 로컬에서 Sass를 관리 할 수 있습니다.
버전 9.0 Next.js에서 HTML로 자동 렌더링되지 않는 페이지가 있습니다. 정적 : 404 페이지.
그 배후의 주된 이유는 404를 제공하는 오류 페이지가 404보다 더 많이 처리 되었기 때문입니다. 예를 들어 오류도 처리했습니다. 존재하지 않는 경로에 대해 404 페이지가 렌더링되므로 요청에 따라 페이지를 렌더링하면 비용과로드가 증가 할 수 있습니다. 섬기는 사람. 프레임 워크 버전 9.3은 상황을 개선하고 자동 정적 최적화를 제공합니다. 404 페이지 용.
이제 요청에 error.js 사용자 정의 페이지가 포함되지 않은 경우 Next.js는 정적으로 404 페이지를 자동으로 생성합니다. 404가 게재되어야 할 때 사용합니다. 이는 자동으로 수행되며 변경할 필요가 없습니다.
이 페이지를 사용자 정의 할 수도 있습니다.. 기본 404 페이지를 바꾸려면 404.js 파일을 만들 수 있습니다.
그것에 대해 더 알고 싶다면 상담 할 수 있습니다. 다음 링크.