Hey, everyone! 👋 I'm Lee, the creator of Mastering Next.js. This course was originally released in 2019. Next.js has evolved quite a bit since v9 and some of this course is officially "outdated".
I've updated the course overview below to annotate which parts are up to date, which have changed, and what my new suggestions are. In my opinion, this is the ideal way to evolve this course. The videos will serve as a reference to a point in time, but newer additions to the framework make certain aspects much easier.
- 🟢 Up to date
- 🟡 Outdated
- 🔴 Do not recommend
- 🎥 Watch Now (26:07)
- 🟢 Here are my latest thoughts on the framework comparison
- 🟡 This video mentions Image Optimization, which is now supported in Next.js
I taught Class Components in 2019 for those still in the process of converting to React Hooks. In 2021, it's now standard to use React Hooks for all projects and I would recommend starting there.
- 🎥 Watch Lesson (21:01)
- 👀 View Code
- 🟢 Props & State
- 🟢 Functional Components
- 🟢 React Hooks
- 🟢 ES6
- 🟢 JSX
- 🟡 Class Components
- 🎥 Watch Lesson (9:49)
- 🟢
next dev
,next build
, andnext start
- 🟢 Prettier
- 🟡 Image Optimization is now supported in Next.js
- 🟡 ESLint is now integrated in Next.js
- 🔴 Standard (Prettier + ESLint won)
- 🎥 Watch Lesson (19:25)
- 👀 View Code
- 🟢
next/link
(client-side routing) - 🟢
useRouter
- 🟢 Retrieving data from URLs
- 🟡
getInitialProps
– This has largely been replaced by newer APIs
- 🎥 Watch Lesson (20:04)
- 👀 View Code
- 🟢 Responsive + Mobile-First Design
- 🟢 styled-jsx
- 🟡 CSS & CSS Modules are now supported out of the box
- 🔴 Sass - I would recommend other options
- 🔴 Styled-Components - I would recommend other options
- 🎥 Watch Lesson (46:30)
- 👀 View Code
- 🟢 API Routes
- 🟢 SWR
- 🟢 GraphQL
- 🟢 Hasura
- 🟡 Apollo Client - I'd recommend SWR
- 🟡 Custom Server - Most needs for this have moved into Next.js core
next start
.
- 🎥 Watch Lesson (14:19)
- 🟢 Favicons
- 🟢 Open Graph
- 🟢 Core themes are still valid for SEO
- 🟡 Image Optimization is now supported in Next.js
- 🟡 There's now official guidance on SEO
- 🎥 Watch Lesson (32:32)
- 👀 View Code
- 🟢 MDX vs CMS
- 🟡 Component Library (Theme UI) – I would recommend other options
- 🔴 StaticKit – Acquired by Formspree
- 🎥 Watch Lesson (23:34)
- 🟢 JWTs
- 🟢 Auth0
- 🟢 I have a new course using Firebase and Next.js
- 🟡 Would recommend next-auth for an OSS solution now
- 🟡 Here are my latest thoughts on State Management (Forms)
- 🎥 Watch Lesson (33:12)
- 🟢 Jest
- 🟢 React Testing Library
- 🟢 Sentry (see latest example)
- 🎥 Watch Lesson (25:41)
- 🟢 TypeScript Integration
- 🟡 Here are my latest thoughts on State Management
- 🟡 Redux (see latest example)
- 🎥 Watch Lesson (11:20)
- 🟢 Vercel
- 🟢 You no longer need to customize anything in
vercel.json
- it just works! - 🟡 ZEIT is now Vercel