Next.js este un cadru React pentru randarea pe server, pe care creatorii săi îl prezintă ca un lanț de instrumente cu o singură comandă cu configurație zero pentru aplicațiile React.
Acest cadru oferă o structură comună care vă permite să creați cu ușurință o aplicație front-end React și gestionează în mod transparent randarea pe partea serverului. Versiunea 9.3 a Next.js a fost lansată luni cu noi funcții și unele îmbunătățiri, dintre care principala noutate o putem găsi capacitatea de a genera site-uri statice.
Ce este nou în Next.js 9.3?
Odată cu lansarea Next.js 9.0, Cadrul a introdus conceptul de optimizare automată statică. Când a pagina nu are cerințe de blocare preluarea datelor, cum ar fi getInitialProps, va reda automat în HTML odată ce a fost construit.
Există și alte cazuri în care s-ar putea să doriți să faceți o pagină în HTML static în timpul compilării, chiar și cu blocarea cerințelor de extragere a datelor. Este cazul, de exemplu, al paginilor de marketing alimentat de un sistem de management al conținutului (CMS).
Next.js 9.3 introduce două noi metode de recuperare a datelor: getStaticProps și getServerSideProps.
Aceste noi metode au multe avantaje față de modelul getInitialProps, deoarece există o distincție clară între ceea ce va deveni SSG (Static Side Generation) și SSR (Server Side Rendering). Sunt completări API.
Toate funcțiile noi sunt compatibile cu versiunea anterioară și Ele pot fi adoptate treptat. Nu există nicio amortizare și getInitialProps continuă să funcționeze normal. S-a adăugat un parametru getStaticPaths pentru a obține rutarea dinamică.
- getStaticProps: Obțineți date în timpul construcției;
- getStaticPaths – Vă permite să specificați rutarea dinamică bazată pe date;
- getServerSideProps - Obțineți date pentru fiecare solicitare.
O altă modificare care iese în evidență în această nouă versiune este suportul pentru modul de previzualizare. Introducerea getStaticProps în Next.js deschide noi posibilități, cum ar fi utilizarea capacităților de randare Next.js la cerere în anumite condiții.
De exemplu, la previzualizarea unei schițe într-un CMS, veți dori să omiteți randarea statică și redați pagina la cerere cu conținut nefinalizat în loc de conținut publicat. Doriți ca Next.js să ignore generarea statică numai în acest caz specific. Potrivit echipei Next.js, modul de previzualizare vă permite să faceți acest lucru.
Modul de Previzualizarea permite utilizatorilor să sară peste pagina generată static pentru a returna la cerere (SSR) o pagină nefinalizată, de exemplu, dintr-un CMS. Cu toate acestea, nu se limitează la anumite sisteme CMS. Modul de previzualizare se integrează direct cu getStaticProps și getServerSideProps, astfel încât să poată fi utilizat cu orice tip de soluție de recuperare a datelor.
Next.js 9.2 a adăugat suport pentru CSS încorporat, dar Next.js 9.3 a adăugat suport pentru Sass. Foile de stil globale și modulele CSS sunt acceptate, precum și CSS încorporat. Next.js acceptă acum module CSS cu fișiere Sass folosind convenția de denumire a fișierelor [name].module.scss. Spre deosebire de suportul disponibil anterior în Next.js 5+ cu next-sass, modulele globale Sass și CSS pot coexista acum.
Modulele CSS vă permite să gestionați local Sass prin crearea automată a numelor de clasă unice.
Cu versiunea 9.0 din Next.js, A existat o pagină care nu a fost redată automat în HTML static: pagina 404.
Motivul principal din spatele acestui lucru este că pagina de eroare care alimentează 404 a fost tratată mai mult decât 404. De exemplu, a gestionat și erori. Deoarece sunt redate 404 pagini pentru rute inexistente, redarea la cerere a paginii ar putea duce la costuri și încărcare mai mari Server. Versiunea 9.3 a cadrului îmbunătățește lucrurile și oferă optimizare statică automată pentru 404 pagini.
Acum, când aplicația dvs. nu include o pagină personalizată error.js, fișierul Next.js generează automat 404 pagini static și îl folosește atunci când ar trebui servit un 404. Acest lucru se întâmplă automat și nu sunt necesare modificări.
De asemenea, puteți personaliza această pagină. Pentru a înlocui pagina implicită 404, poate fi creat un fișier de pagini 404.js.
Dacă doriți să aflați mai multe despre aceasta, puteți consulta următorul link.