Génial Next.js
Liste organisée de ressources : livres, vidéos, articles sur l'utilisation de Next.js.
Next.js : le framework React.
Liste inspirée par le truc génial de la liste. Vous aimerez peut-être aussi génial-tdd.
Contenu
- Génial Next.js
- Contenu
- Communauté
- Essentiel
- Articles
- Plaques passe-partout
- Rallonges
- Applications
- Livres
- Vidéos
- Projets (niveau débutant)
- Lettres d'information
- Contribuer
- Licence
Communauté
- GitHub
- Discussions GitHub pour Next.js
Essentiel
- Blogue
- Apprendre
- Vercel TV
- Pare-balles Suivant
Articles
- Mises à jour instantanées du site avec revalidation à la demande et Directus
- Redirections dynamiques basées sur CMS avec Next.js
- Premiers pas avec Next.js, GraphQL et React Query
- Utilisation de Next.js avec FaunaDB : comment interroger la base de données à partir de votre application
- Comment créer un blog Next.js sans serveur avec ButterCMS
- Créez une application JavaScript universelle avec Next.js
- Premiers pas avec Next.js – Configuration de votre application
- Premiers pas avec Next.js – Introduire des données
- Comment créer une application universelle Next.js React
- Suivant sur Next.js
- Acceptez les paiements sur votre site avec nextjs, stripe et micro
- Next.js sur Cloud Functions pour Firebase avec Firebase Hosting
- Créer un blog avec Next.js
- Utiliser Google Analytics avec Next.js
- Créez une application JavaScript universelle avec Next.js et Redux [russe]
- 5 (parmi les nombreuses raisons) d'aimer Next.js de Vercel
- Next.js 5 : Webpack universel, importations CSS, plugins et zones
- Visualisation des données en temps réel à l'aide de Next.js et Chart.js
- Créez une application de chat avec analyse des sentiments à l'aide de Next.js
- Construisez une table en temps réel avec Next.js
- Blog RSS avec Next.js et Prismic.io
- SEO dans Next.js et Prismic
- SEO dans Next.js avec next-seo
- Suivant.js 7
- Créez des sites Web SSR Next.js à l'aide de GraphQL avec Postgres
- Cuisiner un clone Deliveroo avec Next.js (React), GraphQL, Strapi et Stripe - Configuration (partie 1/7)
- Tutoriel de commerce électronique Next.js : Intégration rapide du panier d'achat
- Travailler avec Ghost et Next.js
- Utiliser Tailwind CSS avec Next.js
- Utilisation des indicateurs de fonctionnalités dans Next.js
- Ajout d'extraits de code à Next.js à l'aide de React-syntax-highlighter
- Créez le site Web/l'application de l'entreprise avec notre étonnant modèle Next.js
- Garantir la livraison des webhooks dans l'application NextJS
- Création d'un livre d'or à l'aide de Next.js On-Demand ISR
- Modèles d'administration utiles pour créer votre site Web/application
- Intégrer l'application Next à Tailwind
Plaques passe-partout
- Modèle Kaminari - Modèle CSS Next.js et Tailwind puissant. Construit en gardant à l'esprit l'expérience des développeurs. Contient les configurations Husky, CommitLint, Prettier, Eslint etc.
- Blog statique Next.js - Blog statique Next.js alimenté par le CMS Cosmic Headless
- Démarreur de blog propulsé par NextJS Headless CMS
- Application Next.js avec AWS Lambda : déployez une application Next.js sur AWS Lambda à l'aide d'Apex Up.
- Nitro - Un exemple de PWA utilisant Nextjs, Material-UI, Typescript et Auth0 ?
- Modèle Typescript Next & Now 2.0 - Sans serveur, Typescript, Jest, Github CI, SCSS, passe-partout plus joli
- Next Right Now - Modèle standard flexible de qualité production avec Next.js 9 et Vercel, avec Sentry préconfiguré, cookies, Amplitude, Emotion, FontAwesome, GraphQL/GraphCMS (Apollo), Bootstrap (Reactstrap), i18next (Locize), Jest, Cypress (tests E2E) et CI/CD (GH Actions), avec prise en charge complète de TypeScript et prise en charge des applications Web multi-tenants B2B (monorépo)
- Next Graphql Apollo Typescript_Boostrap - Pobocha - React + GraphQL + Next.js + Apollo + Scss + Typescript + passe-partout Prettier & EsLint
- Modèle Next & Vercel Typescript - Sans serveur, Typescript, Jest, Github CI, SCSS, passe-partout plus joli
- NextJS dans Firebase avec Bootstrap - Hébergement de l'application NextJS avec Bootstrap dans Firebase avec Cloud Functions.
- Next Simple Starter – Modèle PWA simple avec Next.js et Redux.
- NextJS Starter - Projet de démarrage pour Next.js avec authentification par courrier électronique et oAuth.
- nextjs-starter - Un modèle de kit de démarrage Next.js 10 optimisé pour le référencement avec React 17 + Typescript + Tailwind CSS 2 + React Query 3 + (GitHub Auth + Passwordless Auth) utilisant (NextAuth.js et Fauna DB), ESLint, Prettier, Pre -commit hook avec Husky. Peut avoir différentes mises en page pour différentes pages.
- COURU! - Modèle standard prêt pour la production avec prise en charge de GraphQL, SSR, Hot-reload, CSS-in-JS, mise en cache, etc.
- Next Simple Blog - Blog simple basé sur Markdown construit avec Next.js avec des exportations statiques.
- phox - Créez un blog photo statique.
- Next Express Bootstrap Boilerplate - Boilerplate pour une application full stack construite à l'aide de Next, Express, React-bootstrap, SCSS et SSR avec eslint.
- Next Blog Firestore - Blog avec un CMS simple construit avec Next.js, Firebase Firestore, des composants stylisés et mobx-state-tree.
- Next Redux Starter – Démarreur Next.js avec Express, Redux et PostCSS.
- SuivantJS Redux-Wrapper Material-UI - ? Un NextJS passe-partout avec Redux et Material UI.
- Début - ? Bibliothèque de composants Next.js activement entretenue et passe-partout minimal pour démarrer rapidement avec l'application avec des comptes d'utilisateurs fonctionnels basés sur Ooth.
- SuivantJS TypeScript Starter Kit - ? TypeScript + NextJS, Styled-jsx, Redux, PostCSS, SEO configurable
- Suivant Boilerplate - CSS et Sass externes + Importation d'images de n'importe où + Prettier et Eslint + Variables d'environnement et bien d'autres fonctionnalités.
- next-starter - Un passe-partout complet et simple avec
sass (.scss)
et postcss
intégrés. - Exemple suivant Typescript Monorepo - Un next.js minimaliste + monorepo dactylographié.
- tomimick/tm-nextjs-starter - Un démarreur/démo minimal avec CRUD de base, axios/localstorage, MobX, SASS, exportation de site statique, démo en direct
- csprance/next-smrt - Un passe-partout minimal avec redux, composants stylisés, Material-UI et TypeScript avec un serveur express personnalisé.
- Nextron - Un générateur d'applications Electron avec Next.js ⚡
- next-boilerplate - Un modèle Next.js bien structuré et prêt pour la production avec Typescript, Redux, Express.js, Sass, Css, EnvConfig, Reverse Proxy, Bundle
- Oh My Fullstack - Squelette d'application Web full stack (Next.js, Redux, RxJS, Immutable, Express)
- Next-Postgres-With-Typescript - Application Web fullstack de type forum avec Next 7.0.2 + Sequelize 4/Postgres + Typescript + Redux + Passport Local Auth + Emotion
- Next.js avec Express et Babel - Un squelette d'application pour ceux qui souhaitent transpiler leur Express ainsi que leur code Next.js en utilisant Babel.
- next-postgres-graphql - Créez des sites Web SSR Next.js à l'aide de GraphQL avec Postgres (Next.js, Postgres, GraphQL)
- nextjs-mongodb-app - Application à part entière réalisée avec Next.JS et MongoDB, avec authentification et bien plus encore (Next.js 9, MongoDB)
- réagir-next-boilerplate - Une base pour réduire la configuration de vos projets avec nextJS, les meilleures pratiques de développement et les bibliothèques populaires de la communauté des développeurs.
- The-Nextjs-starter - typescript + redux + composants stylisés + bibliothèque de tests de réaction + eslint + fontawesome
- The Knests Stack - Démarreur passe-partout/hackathon complet avec : PostgreSQL, Knex.js, NestJS, Next.js (évidemment), GraphQL, React (avec hooks et dactylographié), Material-UI, images en plusieurs étapes Docker, Docker compose et un Pipeline Gitlab CI/CD entièrement configuré.
- Devii - Un démarreur de blog de développement inspiré de Medium, construit avec Next.js, React et TypeScript, avec rendu Markdown, coloration syntaxique, balises SEO/méta et génération de flux RSS prête à l'emploi.
- Nextjs Blog Starter – Le code de démarrage parfait pour votre blog basé sur le framework Next.js. ⚡️ Réalisé avec Next.js, TypeScript, ESLint, Prettier, PostCSS, Tailwind CSS.
- Modèle de blog Next.js et Netlify – Un passe-partout parfait pour créer un site Web de blog sur les piles Netlify avec des fonctionnalités standard telles que le balisage, le CMS et les codes courts.
- Nextjs Apollo Nexus - Intégration client-serveur GraphQL Apollo dans Next.js avec Nexus Schema (approche Code first).
- Nextjs Starter Paon - ? Magnifique démarreur de portfolio Nextjs destiné aux ingénieurs logiciels et aux concepteurs pour montrer le travail dont ils sont si fiers.
- Nextatique - ? Modèle de site Web statique multilingue avec pages modifiables par l'utilisateur et navigation à l'aide de Netlify CMS + Next.js + SCSS + Typescript.
- Générateur de plan de site pour NextJS & StrAPI - ? Un serveur supplémentaire sur express qui fonctionne aux côtés de nextjs et régénère le plan du site (avec plan du site d'index) et les fichiers robots.txt à la demande de l'API STR.
- superplate - superplate crée l'application Next.js en quelques secondes avec TypeScript, composants stylisés, SWR, Storybook et 35+ plugins.
- Hydrogène - Hydrogen est un modèle de démarrage de blog Nextjs construit avec les supports tailwindCss et MDX. Il contient tous les codes courts MDX nécessaires prêts à l’emploi.
- Next-Fire-Auth - Un passe-partout génial pour une application de démarrage avec authentification utilisant Next.js + Typescript + Tailwind CSS + Firebase-auth + React-Firebase-Hooks
- Abonnement NextJS Chargebee - Une pile T3 axée sur Chargebee qui intègre les abonnements utilisateur, l'authentification et les tests. Piloté par Prisma ORM.
- Next.js Enterprise - modèle d'entreprise pour des applications hautes performances et maintenables. Construit avec Tailwind CSS, RadixUI, TypeScript et plus encore.
- Start UI [web] - démarreur d'interface utilisateur avisé avec TypeScript, React, NextJS, Chakra UI, tRPC, Prisma, TanStack Query, Storybook, Playwright, Formiz
Rallonges
- Détecteur de langue universel Next - Détecteur de langue qui fonctionne universellement (navigateur + serveur) - Destiné à être utilisé avec un framework universel, tel que Next.js DEMO
- Next Routes - Routes nommées universelles pour Next.js.
- Next-Pkg - Serveur Next.js étendu avec prise en charge de pkg.
- Next Plugin Graphql - Plugin Next.js pour les fichiers .graphql et .gql utilisant graphql-tag
- Next With Apollo - Intégration Apollo Graphql pour Next.js
- Next SEO – Le référencement simplifié pour Next.js
- Next-Sitemap - Générateur de plan de site pour Next.js
- Next UserAgent - Analyseur UserAgent pour Next.js
- Next Cookie - Bibliothèque de sérialisation et de désérialisation de cookies pour Next.js.
- Nextein - Un générateur de site statique basé sur Next.js.
- next-mdx-blog - Ajoutez facilement un blog à n'importe quel projet basé sur next.js
- next-i18next - Le moyen le plus simple de traduire vos applications NextJs.
- next-routes-middleware - Un middleware de routage NextJS
- Plugin Serverless Framework pour Next.js - Déployez facilement des applications sans serveur.
- Terraform For Next.js - Déployez votre application à l'aide de Terraform
- next-session - Middleware de session pour Next.js
- next-iron-session - Utilitaire de session sans état Next.js utilisant des cookies signés et cryptés pour stocker des données
- Next PurgeCSS - Intégrez facilement Purgecss, qui vous aide à supprimer les CSS inutilisés de votre bundle.
- Next PWA - Plugin PWA zéro configuration pour Next.js avec workbox
- flow-middleware - Exécutez n'importe quel middleware Express sur Next.js sans polluer les objets natifs.
- next-connect - Le routeur et la couche middleware compatibles Express/Connect pour Next.js.
- next-img - un plugin pour intégrer facilement des images optimisées.
- next-auth - Authentification facile pour Next.js et Serverless
- next-deploy - Déploiement sans effort sur les pages AWS et GitHub.
- next-joi - Validez les routes de l'API Next.js, avec joi .
- next-transpile-modules - Plugin Next.js pour transpiler le code de node_modules. Utile pour les monorepos.
- Destack for Next.js - Extension Next.js pour créer visuellement des pages de destination localement.
- UseSIWE - Les hooks React et les routes API Next.js qui facilitent l'ajout de la connexion avec Ethereum à votre application.
- Variables d'environnement d'exécution pour Next.js – Arrêtez de configurer les variables ENV dans CI/CD, utilisez une approche cloud native.
- next-google-tag-manager – Ajoutez facilement Google Tag Manager à Next 13 et plus.
- next-api-decorators - Décorateurs pour créer des routes API Next.js typées, avec une validation et une transformation faciles des demandes.
Applications
- CourseLit - Une alternative open source à Thinkific, Teachable, etc.
- Feednext - Une application de médias sociaux open source.
- NextJS GOT - Application Next.js simple qui présente les personnages de Game of Thrones.
- Relate - Communauté de pleine conscience - React, GraphQL, Next.js.
- Mot de passe - Un mot de passe, dans le bon sens.
- Next Todos - Liste de tâches écrite en Next.js.
- Hacker News - Une autre Hacker News écrite en Next.js.
- Jet Chat - Démo de chat propulsée par Jet et Next.js.
- Nextgram - Exemple d'application Next.js v2 pour montrer ses capacités.
- Rauchg Blog - Blog créé par un responsable principal de Next.js.
- Next JPH - Exemple d'application JsonPlaceholder réalisée avec Next.js.
- Mailto - HTML mailto est simplifié.
- Plate - L'application de gestion des tâches pour les gouverner tous.
- Tableau de bord - Créez votre propre tableau de bord d'équipe avec des widgets personnalisés.
- Snape - Un client torrent pour rechercher, diffuser et télécharger des torrents.
- Trello Resume - Convertit les données Trello en informations à lecture rapide.
- Authentification du serveur avec JWT - Authentification du serveur, empêche le rendu avant validation.
- Site Web d'Alexander Kachkaev – page d'accueil personnelle construite avec Next.js, GraphQL, Docker et Kubernetes. Utilise le client Apollo, React-intl, les composants stylisés et recompose. Les images Docker sont automatiquement créées par GitLab CI.
- Gestionnaire de cookies avec rendu du serveur - Gestionnaire de cookies avec rendu du serveur, accédez au cookie avant le rendu.
- Gank - Une application Next.js utilise gank-api, mobx et antd
- Exemple de CMS découplé avec GraphQL et Next.js
- Accueil Mozilla VR - Accueil Mozilla VR
- Site Web d'Elton John - Site Web d'Elton John
- Place de marché des données de l'IOTA - Place de marché IOTA
- magicleap.com - Magic Leap
- Page de recherche NPM.js - Page de recherche de NPM
- Centre de réussite Docker - Centre de réussite Docker
- Urteile & Gesetze - Système d'information juridique allemand sous licence GPLv3.
- Page d'accueil de TikTok - Page d'accueil de TikTok
- njt.now.sh - npm passer à ? (les raccourcis de navigation des packages dont vous rêviez). Partiellement rendu statique, partiellement déployé en tant que lambda. Mise à jour automatique à chaque commit dans le dépôt github, grâce à l'intégration Now.
- caseconverter.pro - Un convertisseur de casse de texte.
- Tottem - Gestionnaire de favoris sur stéroïde construit avec NextJs / Auth0 / Apollo Tools / Prisma2
- Slow TV Map - Une façon amusante de découvrir des expériences virtuelles relaxantes. Next.js + Chakra UI + MySQL hébergé sur Vercel.
- Twitter Clone - Clone Twitter construit avec Next.js + T3 Stack + NextAuth + Supabase + Prisma.
- Taxonomie - Un exemple d'application créée à l'aide des composants du serveur Next.js 13.
- shadcn/ui - Composants magnifiquement conçus que vous pouvez copier et coller dans vos applications.
- StorageBox - Un service de stockage de fichiers simple construit avec Go et Next.js.
Livres
- Hands On Next.js - Un livre complet pratique sur le rendu universel (serveur) pour les applications React.
- Guide de démarrage rapide Next.js - Créez, créez et déployez des applications JavaScript universelles à l'aide de Next.js
- Le manuel Next.js - Créez une application React frontale qui gère de manière transparente le rendu côté serveur pour vous.
- Applications Web sans serveur avec React et Next.js - Utilisez les fonctionnalités sans serveur de Next.js pour accéder aux bases de données et authentifier les utilisateurs dans vos applications React
- Coupez dans le Jamstack : créez un SaaS avec React et Next.js - Créez une application logicielle en tant que service complète à l'aide de Next.js, Prisma ORM, Cloudinary API, Chakra-UI et React Hook Form.
- Real World Next.js – Créez des applications Web évolutives, performantes et modernes à l'aide de Next.js, le framework React pour la production.
Vidéos
- Créez votre première application ReactJS avec NextJS [espagnol]
- Réagir au rendu côté serveur avec NextJS
- Guillermo Rauch - Next.js par exemple
- Guillermo Rauch - Next.js : Universal React rendu facile et simple
- Introduction à Next.js
- Next.js en production
- Routage paramétré avec Next.js
- JSHéros 2017 | Guillermo Rauch - Next.js statique et dynamique
- Programmer le futur universel avec Next.js - Guillermo Rauch · JSConf China 2017
- BPJS : Spécial – Introduction à Next.js
- Suivant pour Next.js
- Gestion des données avec Next.js et GraphQL
- Next.js Enregistrer l'utilisateur
- Cours accéléré Next.js - Réaction côté serveur
- Mastering Next.js - Cours vidéo de plus de 50 leçons pour créer des applications avec Next.js et React.
- Tutoriel Next.js – Tutoriels Next.js approfondis.
- Next.js Conf 2020 - Toutes les vidéos de la conférence Next.js 2020
- Application de commande de nourriture complète avec Hasura, Next.js et Vercel
- Comment utiliser l'authentification des informations d'identification dans Next.js avec NextAuth ?
Projets (niveau débutant)
- Clone Netflix Full Stack dans React, Tailwind CSS, Next.JS, Prisma, MongoDB, NextAuth et Vercel (2023)
- Créez et déployez un site Web Next 13 moderne avec Framer Motion et Tailwind CSS
- Projet Next js 13 - Clone IMBb - Projet CSS Next Js Tailwind - Projet Nextjs
- Projet Next js 13 - Clone Google (next.js 13, tailwind css 3, API de recherche Google, routeur d'application
- prochain projet js - clone Twitter
- Construire et déployer : cloner TWITTER avec React, Tailwind, Next, Prisma, Mongo, NextAuth et Vercel (2023)
- Tutoriel NextJS 13 : Créer un blog statique à partir de fichiers Markdown
- Clone Airbnb Full Stack avec routeur d'application Next.js 13 : React, Tailwind, Prisma, MongoDB, NextAuth 2023
- Clone de Messenger en temps réel : Next.js 13, React, Tailwind, Prisma, MongoDB, NextAuth, Pusher (2023)
- Clone Spotify Full Stack : Next 13.4, React, Stripe, Supabase, PostgreSQL, Tailwind (2023)
- E-Commerce Full Stack + Tableau de bord et CMS : Routeur d'applications Next.js 13, React, Tailwind, Prisma, MySQL, 2023
Lettres d'information
- Next.js News - Newsletter mensuelle Next.js présentant les fonctionnalités nouvelles et à venir, les meilleurs articles, outils et plugins.
- Notes Next.js - Actualités mensuelles des plateformes Next.js et JavaScript.
Contribuer
Vous avez trouvé un package, un article, un blog, une vidéo génial, etc. ? Envoyez-moi une pull request ! Suivez simplement les directives. Merci!
Consultez mon blog ou dites bonjour sur Twitter.
Licence