Maîtriser Next.js
Hé, tout le monde! Je suis Lee, le créateur de Mastering Next.js. Ce cours a été initialement publié en 2019. Next.js a évolué un peu depuis V9 et une partie de ce cours est officiellement "dépassé".
J'ai mis à jour l'aperçu du cours ci-dessous pour annoter les pièces à jour, qui ont changé et quelles sont mes nouvelles suggestions. À mon avis, c'est le moyen idéal d' évoluer ce cours. Les vidéos serviront de référence à un moment, mais les nouveaux ajouts au cadre facilitent certains aspects.
- ? À jour
- ? Dépassé
- ? Ne recommande pas
Introduction
- ? Regardez maintenant (26:07)
- ? Voici mes dernières réflexions sur la comparaison du cadre
- ? Cette vidéo mentionne l'optimisation de l'image, qui est maintenant prise en charge dans Next.js
Aperçu de la réaction
J'ai enseigné les composants de classe en 2019 pour ceux qui sont encore en train de se convertir en crochets React. En 2021, il est désormais standard d'utiliser React Hooks pour tous les projets et je recommanderais de commencer là-bas.
- ? Regardez leçon (21:01)
- ? Afficher le code
- ? Accessoires et état
- ? Composants fonctionnels
- ? Réagir des crochets
- ? ES6
- ? JSX
- ? Composants de classe
Développer localement
- ? Regarder leçon (9:49)
- ?
next dev , next build et next start - ? Plus joli
- ? L'optimisation de l'image est désormais prise en charge dans Next.js
- ? Eslint est désormais intégré dans Next.js
- ? Standard (plus joli + Eslint a gagné)
Naviguer entre les pages
- ? Regarder leçon (19:25)
- ? Afficher le code
- ?
next/link (routage côté client) - ?
useRouter - ? Récupération des données des URL
- ?
getInitialProps - Cela a été largement remplacé par de nouvelles API
Coiffage
- ? Regardez leçon (20:04)
- ? Afficher le code
- ? Conception réactive + mobile d'abord
- ? Styled-JSX
- ? Les modules CSS et CSS sont désormais pris en charge de la boîte
- ? Sass - je recommanderais d'autres options
- ? Componsents stylisés - je recommanderais d'autres options
Recherche de données
- ? Regarder leçon (46:30)
- ? Afficher le code
- ? Routes API
- ? SWR
- ? Graphique
- ? Hasura
- ? Client Apollo - je recommanderais SWR
- ? Serveur personnalisé - La plupart des besoins pour cela ont déménagé dans
next start .
Gestion des actifs et du référencement
- ? Regarder leçon (14:19)
- ? Favicons
- ? Graphique ouvert
- ? Les thèmes de base sont toujours valables pour le référencement
- ? L'optimisation de l'image est désormais prise en charge dans Next.js
- ? Il y a maintenant des conseils officiels sur le référencement
Construire un blog avec MDX
- ? Regardez leçon (32:32)
- ? Afficher le code
- ? MDX vs CMS
- ? Bibliothèque de composants (UI du thème) - Je recommanderais d'autres options
- ? Statickit - acquis par FormSpree
Authentification
- ? Regarder leçon (23:34)
- ? Jwts
- ? Auth0
- ? J'ai un nouveau cours en utilisant Firebase et Next.js
- ? Je recommanderais maintenant l'automobile pour une solution OSS
- ? Voici mes dernières réflexions sur la gestion de l'État (formulaires)
Test et gestion des erreurs
- ? Regarder leçon (33:12)
- ? Plaisanter
- ? Bibliothèque de tests React
- ? Sentry (voir le dernier exemple)
Gestion de l'État et plus
- ? Regarder leçon (25:41)
- ? Intégration dactylographiée
- ? Voici mes dernières réflexions sur la gestion de l'État
- ? Redux (voir le dernier exemple)
Exportation et déploiement
- ? Regarder leçon (11:20)
- ? Vercel
- ? Vous n'avez plus besoin de personnaliser quoi que ce soit dans
vercel.json - cela fonctionne juste! - ? Zeit est maintenant Vercel