Mastering Next.js
이봐, 다들! 저는 Lee, Mastering Next.js의 제작자입니다. 이 과정은 원래 2019 년에 발표되었습니다. Next.js는 V9 이후로 상당히 진화 했으며이 과정 중 일부는 공식적으로 "구식"입니다.
아래의 과정 개요를 최신 상태, 변경된 부품 및 새로운 제안이 무엇인지에 대한 주석을 달성했습니다. 제 생각에는 이것이이 과정을 발전시키는 이상적인 방법입니다. 이 비디오는 시점에 대한 참조 역할을하지만 프레임 워크에 새로운 추가 기능을 사용하면 특정 측면이 훨씬 쉬워집니다.
소개
- ? 지금보기 (26:07)
- ? 프레임 워크 비교에 대한 최신 생각은 다음과 같습니다
- ? 이 비디오는 이미 이미지 최적화를 언급하며, 이제 Next.js에서 지원됩니다.
개요를 반응합니다
나는 2019 년에 반응 후크로 변환하는 과정에서 수업 구성 요소를 가르쳤다. 2021 년에는 이제 모든 프로젝트에 React Hooks를 사용하는 것이 표준이며 그곳에서 시작하는 것이 좋습니다.
- ? 수업보기 (21:01)
- ? 코드를 봅니다
- ? 소품 및 상태
- ? 기능성 구성 요소
- ? 반응 후크
- ? ES6
- ? JSX
- ? 클래스 구성 요소
현지에서 개발
- ? 레슨 시청 (9:49)
- ?
next dev , next build 및 next start - ? 더 예쁘다
- ? 이미지 최적화는 이제 Next.js에서 지원됩니다
- ? Eslint는 이제 Next.js에 통합되었습니다
- ? 표준 (Prettier + Eslint Win)
페이지 간 탐색
- ? 수업 시청 (19:25)
- ? 코드를 봅니다
- ?
next/link (클라이언트 측 라우팅) - ?
useRouter - ? URL에서 데이터 검색
- ?
getInitialProps - 이것은 크게 새로운 API로 대체되었습니다.
스타일링
- ? 레슨보기 (20:04)
- ? 코드를 봅니다
- ? 응답 + 모바일 우선 디자인
- ? 스타일 -JSX
- ? CSS & CSS 모듈은 이제 상자 밖으로 지원됩니다.
- ? Sass- 다른 옵션을 추천합니다
- ? 스타일의 경쟁자 - 다른 옵션을 추천합니다
데이터 가져 오기
- ? 레슨보기 (46:30)
- ? 코드를 봅니다
- ? API 경로
- ? SWR
- ? 그래프 QL
- ? 하수라
- ? Apollo Client- SWR을 추천합니다
- ? 사용자 정의 서버 - 이에 대한 대부분의 요구는 Next.js Core
next start 으로 이동했습니다.
자산 및 SEO 관리
- ? 레슨 시청 (14:19)
- ? 파비콘
- ? 그래프를 엽니 다
- ? 핵심 테마는 여전히 SEO에 유효합니다
- ? 이미지 최적화는 이제 Next.js에서 지원됩니다
- ? 이제 SEO에 대한 공식 지침이 있습니다
MDX로 블로그 구축
- ? 레슨 시청 (32:32)
- ? 코드를 봅니다
- ? MDX 대 CMS
- ? 구성 요소 라이브러리 (테마 UI) - 다른 옵션을 추천합니다.
- ? Statickit - Formspree가 인수했습니다
입증
- ? 레슨 시청 (23:34)
- ? JWT
- ? Auth0
- ? Firebase와 Next.js를 사용하는 새로운 코스가 있습니다
- ? OSS 솔루션을 위해 Next-Auth를 권장합니다
- ? 다음은 주 경영 (양식)에 대한 최신 생각입니다.
테스트 및 오류 처리
- ? 레슨 시청 (33:12)
- ? 농담
- ? 반응 테스트 라이브러리
- ? 센트리 (최신 예 참조)
국가 관리 및 기타
- ? 레슨 시청 (25:41)
- ? TypeScript 통합
- ? 주 경영에 대한 최신 생각은 다음과 같습니다
- ? Redux (최신 예 참조)
수출 및 배포
- ? 레슨보기 (11:20)
- ? Vercel
- ? 더 이상
vercel.json 에서 아무것도 사용자 정의 할 필요가 없습니다. - ? Zeit은 이제 Vercel입니다
