awesome nextjs

Tolles Next.js

Kuratierte Ressourcenliste: Bücher, Videos, Artikel über die Verwendung von Next.js.

Next.js: Das React Framework.

Liste inspiriert von der tollen Listensache. Vielleicht gefällt Ihnen auch awesome-tdd.

Inhalt

• Tolles Next.js
  • Inhalt
  • Gemeinschaft
  • Wesentliches
  • Artikel
  • Boilerplates
  • Erweiterungen
  • Apps
  • Bücher
  • Videos
  • Projekte (Anfängerniveau)
  • Newsletter
  • Mitwirken
  • Lizenz

Gemeinschaft

• GitHub
• GitHub-Diskussionen für Next.js

Wesentliches

• Blog
• Lernen
• Vercel TV
• Bulletproof Next

Artikel

• Sofortige Site-Updates mit On-Demand-Revalidierung und Directus
• Dynamische CMS-gesteuerte Weiterleitungen mit Next.js
• Erste Schritte mit Next.js, GraphQL und React Query
• Verwenden von Next.js mit FaunaDB: So fragen Sie die Datenbank aus Ihrer App ab
• So erstellen Sie ein serverloses Next.js-Blog mit ButterCMS
• Erstellen Sie eine universelle JavaScript-App mit Next.js
• Erste Schritte mit Next.js – Einrichten Ihrer App
• Erste Schritte mit Next.js – Daten einbinden
• So erstellen Sie eine Next.js React Universal App
• Weiter auf Next.js
• Akzeptieren Sie Zahlungen auf Ihrer Website mit nextjs, Stripe und Micro
• Next.js auf Cloud Functions für Firebase mit Firebase Hosting
• Erstellen eines Blogs mit Next.js
• Verwendung von Google Analytics mit Next.js
• Erstellen Sie eine universelle JavaScript-App mit Next.js und Redux [Russisch]
• 5 (der vielen Gründe), Vercels Next.js zu lieben
• Next.js 5: Universelles Webpack, CSS-Importe, Plugins und Zonen
• Echtzeit-Datenvisualisierung mit Next.js und Chart.js
• Erstellen Sie mit Next.js eine Chat-App mit Stimmungsanalyse
• Erstellen Sie eine Echtzeittabelle mit Next.js
• SSR-Blog mit Next.js und Prismic.io
• SEO in Next.js und Prismic
• SEO in Next.js mit next-seo
• Next.js 7
• Erstellen Sie SSR Next.js-Websites mit GraphQL und Postgres
• Einen Deliveroo-Klon mit Next.js (React), GraphQL, Strapi und Stripe kochen – Setup (Teil 1/7)
• Next.js E-Commerce-Tutorial: Schnelle Warenkorb-Integration
• Arbeiten mit Ghost und Next.js
• Verwenden von Tailwind CSS mit Next.js
• Verwenden von Feature-Flags in Next.js
• Hinzufügen von Codefragmenten zu Next.js mithilfe von React-Syntax-Highlighter
• Erstellen Sie die Website/App Ihres Unternehmens mit unserer erstaunlichen Next.js-Vorlage
• Gewährleistung der Webhook-Bereitstellung in der NextJS-Anwendung
• Erstellen eines Gästebuchs mit Next.js On-Demand ISR
• Nützliche Admin-Vorlagen zum Erstellen Ihrer Website/App
• Integrieren Sie die Next-App mit Tailwind

Boilerplates

• Kaminari-Vorlage – leistungsstarke Next.js- und Tailwind-CSS-Vorlage. Entwickelt unter Berücksichtigung der Entwicklererfahrung. Enthält Husky-, CommitLint-, Prettier-, Eslint- usw. Konfigurationen.
• Statischer Next.js-Blog – Statischer Next.js-Blog, unterstützt durch das Cosmic Headless CMS
• NextJS Headless CMS-basierter Blog-Starter
• Next.js-App mit AWS Lambda – Stellen Sie mit Apex Up eine Next.js-App für AWS Lambda bereit.
• Nitro – Ein Beispiel für eine PWA mit Nextjs, Material-UI, Typescript und Auth0?
• Next & Now 2.0 Typescript-Vorlage – Serverlos, Typescript, Jest, Github CI, SCSS, hübscheres Boilerplate
• Next Right Now – Flexibles Boilerplate in Produktionsqualität mit Next.js 9 und Vercel, mit vorkonfiguriertem Sentry, Cookies, Amplitude, Emotion, FontAwesome, GraphQL/GraphCMS (Apollo), Bootstrap (Reactstrap), i18next (Locize), Jest, Cypress (E2E-Tests) und CI/CD (GH Actions), mit vollständiger TypeScript-Unterstützung und Unterstützung für B2B-Multi-Tenants-Web-Apps (Monorepo)
• Nächster Graphql Apollo Typescript_Boostrap – Pobocha – React + GraphQL + Next.js + Apollo + Scss + Typescript + Prettier & EsLint Boilerplate
• Next & Vercel Typescript-Vorlage – Serverlos, Typescript, Jest, Github CI, SCSS, hübscheres Boilerplate
• NextJS in Firebase mit Bootstrap – Hosten der NextJS-App mit Bootstrap in Firebase mit Cloud Functions.
• Next Simple Starter – Einfaches PWA-Boilerplate mit Next.js und Redux.
• NextJS Starter – Starterprojekt für Next.js mit E-Mail- und oAuth-Authentifizierung.
• nextjs-starter – Eine SEO-optimierte Next.js 10-Starterkit-Vorlage mit React 17 + Typescript + Tailwind CSS 2 + React Query 3 + (GitHub Auth + Passwordless Auth) unter Verwendung von (NextAuth.js und Fauna DB), ESLint, Prettier, Pre -Commit-Hook mit Husky. Kann unterschiedliche Layouts für verschiedene Seiten haben.
• RAN! - Produktionsbereites Boilerplate mit Unterstützung für GraphQL, SSR, Hot-Reload, CSS-in-JS, Caching und mehr.
• Next Simple Blog – Einfaches Markdown-basiertes Blog, erstellt mit Next.js mit statischen Exporten.
• phox – Erstellen Sie einen statischen Fotoblog.
• Next Express Bootstrap Boilerplate – Boilerplate für eine Full-Stack-App, die mit Next, Express, React-Bootstrap, SCSS und SSR mit Eslint erstellt wurde.
• Next Blog Firestore – Blog mit einfachem CMS, erstellt mit Next.js, Firebase Firestore, Styled-Components und Mobx-State-Tree.
• Next Redux Starter – Next.js-Starter mit Express, Redux und PostCSS.
• NextJS Redux-Wrapper Material-UI - ? Ein Standard-NextJS mit Redux und Material UI.
• Start - ? Aktiv gepflegte Next.js-Komponentenbibliothek und minimale Boilerplate, um schnell mit der App mit funktionierenden Benutzerkonten auf Basis von Ooth zu starten.
• NextJS TypeScript Starter Kit – ? TypeScript + NextJS, Styled-jsx, Redux, PostCSS, konfigurierbares SEO
• Nächstes Boilerplate – Externes CSS und Sass + Bilder von überall importieren + Prettier und Eslint + Umgebungsvariablen und viele weitere Funktionen.
• next-starter – Ein vollständiges und einfaches Boilerplate mit integriertem sass (.scss) und postcss .
• Typescript Monorepo Next-Beispiel – Ein minimalistisches next.js + Typescript-Monorepo.
• tomimick/tm-nextjs-starter – Ein minimaler Starter/Demo mit grundlegendem CRUD, axios/localstorage, MobX, SASS, statischem Site-Export, Live-Demo
• csprance/next-smrt – Ein minimales Boilerplate mit Redux, Styled-Components, Material-UI und Typescript mit einem benutzerdefinierten Express-Server.
• Nextron – Ein Electron mit Next.js-Apps-Generator ⚡
• next-boilerplate – Ein gut strukturiertes, produktionsbereites Next.js-Boilerplate mit Typescript, Redux, Express.js, Sass, Css, EnvConfig, Reverse Proxy, Bundle
• Oh My Fullstack – Full-Stack-Webanwendungsgerüst (Next.js, Redux, RxJS, Immutable, Express)
• Next-Postgres-With-Typescript – Forumähnliche Fullstack-Webanwendung mit Next 7.0.2 + Sequelize 4/Postgres + Typescript + Redux + Passport Local Auth + Emotion
• Next.js mit Express und Babel – Ein Anwendungsskelett für diejenigen, die sowohl ihren Express- als auch ihren Next.js-Code mit Babel transpilieren möchten.
• next-postgres-graphql – Erstellen Sie SSR Next.js-Websites mit GraphQL mit Postgres (Next.js, Postgres, GraphQL)
• nextjs-mongodb-app – Vollwertige App erstellt mit Next.JS und MongoDB, mit Authentifizierung und vielem mehr (Next.js 9, MongoDB)
• React-Next-Boilerplate – Eine Grundlage zur Reduzierung der Konfiguration Ihrer Projekte mit NextJS, Best Development Practices und beliebten Bibliotheken in der Entwickler-Community.
• The-Nextjs-Starter – Typescript + Redux + Styled-Components + React-Testing-Library + Eslint + Fontawesome
• Der Knests Stack – Full-Stack-Boilerplate/Hackathon-Starter mit: PostgreSQL, Knex.js, NestJS, Next.js (natürlich), GraphQL, React (mit Hooks und Typescript), Material-UI, Docker-Multistage-Images für, Docker Compose und a Gitlab CI/CD-Pipeline vollständig konfiguriert.
• Devii – Ein von Medium inspirierter Entwickler-Blog-Starter, der mit Next.js, React und TypeScript erstellt wurde und standardmäßig Markdown-Rendering, Syntaxhervorhebung, SEO/Meta-Tags und RSS-Feed-Generierung bietet.
• Nextjs Blog Starter – Der perfekte Startercode für Ihr Blog basierend auf dem Next.js-Framework. ⚡️ Erstellt mit Next.js, TypeScript, ESLint, Prettier, PostCSS, Tailwind CSS.
• Next.js- und Netlify-Blogging-Vorlage – Eine perfekte Vorlage zum Erstellen einer Blog-Website auf Netlify-Stacks mit Standardfunktionen wie Tagging, CMS und Shortcodes.
• Nextjs Apollo Nexus – GraphQL Apollo Client-Server-Integration in Next.js mit Nexus-Schema (Code-First-Ansatz).
• Nextjs Starter Peacock - ? Wunderschöner Nextjs-Portfolio-Starter für Softwareentwickler und Designer, um Arbeiten zu zeigen, auf die sie so stolz sind.
• Nextatic - ? Statisches, mehrsprachiges Website-Boilerplate mit vom Benutzer bearbeitbaren Seiten und Navigation mithilfe von Netlify CMS + Next.js + SCSS + Typescript.
• Sitemap-Generator für NextJS & StrAPI - ? Ein zusätzlicher Server auf Express, der neben nextjs läuft und Sitemap-Dateien (mit Index-Sitemap) und robots.txt-Dateien auf Anfrage von der STR-API neu generiert.
• superplate – Superplate erstellt in Sekundenschnelle eine Next.js-App mit TypeScript, Styled-Components, SWR, Storybook und über 35 Plugins.
• Hydrogen – Hydrogen ist eine Nextjs-Blog-Startervorlage mit TailwindCss- und MDX-Unterstützung. Es verfügt über alle erforderlichen MDX-Shortcodes.
• Next-Fire-Auth – Ein fantastisches Boilerplate für Startanwendungen mit Authentifizierung mithilfe von Next.js + Typescript + Tailwind CSS + Firebase-auth + React-Firebase-Hooks
• NextJS Chargebee-Abonnement – ​​Ein auf Chargebee ausgerichteter T3-Stack, der Benutzerabonnements, Authentifizierung und Tests integriert. Angetrieben von Prisma ORM.
• Next.js Enterprise – Boilerplate der Enterprise-Klasse für leistungsstarke, wartbare Apps. Gebaut mit Tailwind CSS, RadixUI, TypeScript und mehr.
• Start UI [Web] – eigenwilliger UI-Starter mit TypeScript, React, NextJS, Chakra UI, tRPC, Prisma, TanStack Query, Storybook, Playwright, Formiz

Erweiterungen

• Nächster universeller Sprachdetektor – Sprachdetektor, der universell funktioniert (Browser + Server) – Zur Verwendung mit einem universellen Framework wie Next.js DEMO vorgesehen
• Next Routes – Universelle benannte Routen für Next.js.
• Next-Pkg – Erweiterter Next.js-Server mit Pkg-Unterstützung.
• Nächstes Plugin Graphql – Next.js-Plugin für .graphql- und .gql-Dateien mit graphql-tag
• Weiter mit Apollo – Apollo Graphql-Integration für Next.js
• Next SEO – SEO leicht gemacht für Next.js
• Next-Sitemap – Sitemap-Generator für Next.js
• Next UserAgent – ​​UserAgent-Parser für Next.js
• Next Cookie – Cookie-Serialisierungs- und Deserialisierungsbibliothek für Next.js.
• Nextein – Ein statischer Site-Generator basierend auf Next.js.
• next-mdx-blog – Fügen Sie ganz einfach einen Blog zu jedem next.js-basierten Projekt hinzu
• next-i18next – Der einfachste Weg, Ihre NextJs-Apps zu übersetzen.
• next-routes-middleware – Eine NextJS-Routing-Middleware
• Serverless Framework-Plugin für Next.js – Einfache Bereitstellung serverloser Anwendungen.
• Terraform für Next.js – Stellen Sie Ihre Anwendung mit Terraform bereit
• next-session – Sitzungs-Middleware für Next.js
• next-iron-session – Next.js zustandsloses Sitzungsdienstprogramm, das signierte und verschlüsselte Cookies zum Speichern von Daten verwendet
• Weiter PurgeCSS – Integrieren Sie ganz einfach Purgecss, was Ihnen hilft, ungenutztes CSS aus Ihrem Bundle zu entfernen.
• Next PWA – Null-Konfigurations-PWA-Plugin für Next.js mit Workbox
• flow-middleware – Führen Sie beliebige Express-Middlewares auf Next.js aus, ohne native Objekte zu verschmutzen.
• next-connect – Der Express/Connect-kompatible Router und die Middleware-Schicht für Next.js.
• next-img – ein Plugin zum einfachen Einbetten optimierter Bilder.
• next-auth – Einfache Authentifizierung für Next.js und Serverless
• next-deploy – Mühelose Bereitstellung auf AWS- und GitHub-Seiten.
• next-joi – Validieren Sie Next.js-API-Routen mit joi .
• next-transpile-modules – Next.js-Plugin zum Transpilieren von Code aus node_modules. Nützlich für Monorepos.
• Destack für Next.js – Next.js-Erweiterung zum visuellen lokalen Erstellen von Landingpages.
• Verwenden Sie SIWE – React-Hooks und Next.js-API-Routen, die es ganz einfach machen, die Anmeldung mit Ethereum zu Ihrer App hinzuzufügen.
• Laufzeitumgebungsvariablen für Next.js – Hören Sie auf, ENV-Variablen in CI/CD zu konfigurieren, und verwenden Sie einen Cloud-nativen Ansatz.
• next-google-tag-manager – Fügen Sie Google Tag Manager ganz einfach zu Next 13 und höher hinzu.
• next-api-decorators – Dekoratoren zum Erstellen typisierter Next.js-API-Routen mit einfacher Anforderungsvalidierung und -transformation.

Apps

• CourseLit – Eine Open-Source-Alternative zu Thinkific, Teachable usw.
• Feednext – Eine Open-Source-Social-Media-Anwendung.
• NextJS GOT – Einfache Next.js-Anwendung, die Game of Thrones-Charaktere präsentiert.
• Relate – Achtsamkeits-Community – React, GraphQL, Next.js.
• Passwort – Ein Passwort, richtig.
• Nächste Todos – Todo-Liste geschrieben in Next.js.
• Hacker-News – Eine weitere Hacker-News geschrieben in Next.js.
• Jet Chat – Jet- und Next.js-basierte Chat-Demo.
• Nextgram – Beispiel einer Next.js v2-App zur Demonstration ihrer Fähigkeiten.
• Rauchg-Blog – Blog erstellt von einem Next.js-Kernbetreuer.
• Next JPH – JsonPlaceholder-Beispiel-App, erstellt mit Next.js.
• Mailto – HTML-Mailtos leicht gemacht.
• Plate – Die Aufgabenverwaltungs-App, um sie alle zu beherrschen.
• Dashboard – Erstellen Sie Ihr eigenes Team-Dashboard mit benutzerdefinierten Widgets.
• Snape – Ein Torrent-Client zum Suchen, Streamen und Herunterladen von Torrents.
• Trello Resume – Wandelt Trello-Daten in schnell lesbare Informationen um.
• Serverauthentifizierung mit JWT – Serverauthentifizierung, verhindert das Rendern vor der Validierung.
• Website von Alexander Kachkaev – persönliche Homepage erstellt mit Next.js, GraphQL, Docker und Kubernetes. Verwendet Apollo-Client, React-Intl, Styled-Components und Recompose. Docker-Images werden automatisch von GitLab CI erstellt.
• Cookie-Handler mit Server-Rendering – Cookie-Handler mit Server-Rendering, greifen Sie vor dem Rendern auf das Cookie zu.
• Gank – Eine Next.js-App, die Gank-API, Mobx und Antd verwendet
• Entkoppeltes CMS-Beispiel mit GraphQL und Next.js
• Mozilla VR-Startseite - Mozilla VR-Startseite
• Elton Johns Website - Elton Johns Website
• IOTAs Datenmarktplatz – IOTA Marktplatz
• magicleap.com - Magic Leap
• NPM.js-Suchseite – NPMs Suchseite
• Docker-Erfolgszentrum – Docker-Erfolgszentrum
• Urteile & Gesetze – Deutsches Rechtsinformationssystem lizenziert unter GPLv3.
• TikToks Homepage – TikToks Homepage
• njt.now.sh - npm springen zu? (Paketnavigationsverknüpfungen, von denen Sie geträumt haben). Teilweise statisch gerendert, teilweise als Lambda bereitgestellt. Dank der Now-Integration wird es bei jedem Commit zum Github-Repo automatisch aktualisiert.
• caseconverter.pro – Ein Text-Groß-/Kleinschreibungskonverter.
• Tottem – Lesezeichen-Manager auf Steroid, erstellt mit NextJs / Auth0 / Apollo Tools / Prisma2
• Slow TV Map – Eine unterhaltsame Möglichkeit, entspannende virtuelle Erlebnisse zu entdecken. Next.js + Chakra UI + MySQL gehostet auf Vercel.
• Twitter-Klon – Twitter-Klon erstellt mit Next.js + T3 Stack + NextAuth + Supabase + Prisma.
• Taxonomie – Eine Beispiel-App, die mit Next.js 13-Serverkomponenten erstellt wurde.
• shadcn/ui – Wunderschön gestaltete Komponenten, die Sie kopieren und in Ihre Apps einfügen können.
• StorageBox – ein einfacher Dateispeicherdienst, der mit Go und Next.js erstellt wurde.

Bücher

• Hands On Next.js – Ein praktisches Fullstack-Buch zum universellen (Server-)Rendering für Reaktionsanwendungen.
• Next.js-Schnellstartanleitung – Erstellen, erstellen und implementieren Sie universelle JavaScript-Anwendungen mit Next.js
• Das Next.js-Handbuch – Erstellen Sie eine Frontend-React-Anwendung, die das serverseitige Rendering transparent für Sie übernimmt.
• Serverlose Webanwendungen mit React und Next.js – Nutzen Sie die serverlosen Funktionen von Next.js, um auf Datenbanken zuzugreifen und Benutzer in Ihren React-Anwendungen zu authentifizieren
• Schnitt in den Jamstack: Erstellen Sie ein SaaS mit React und Next.js – Erstellen Sie eine Full-Stack-Software-as-a-Service-Anwendung mit Next.js, Prisma ORM, Cloudinary API, Chakra-UI und React Hook Form.
• Real World Next.js – Erstellen Sie skalierbare, leistungsstarke und moderne Webanwendungen mit Next.js, dem React-Framework für die Produktion

Videos

• Erstellen Sie Ihre erste ReactJS-Anwendung mit NextJS [Spanisch]
• Reagieren Sie auf serverseitiges Rendering mit NextJS
• Guillermo Rauch – Next.js am Beispiel
• Guillermo Rauch – Next.js: Universal React leicht und unkompliziert gemacht
• Einführung in Next.js
• Next.js in Produktion
• Parametrisiertes Routing mit Next.js
• JSHeroes 2017 | Guillermo Rauch – Statisches und dynamisches Next.js
• Die universelle Zukunft programmieren mit Next.js – Guillermo Rauch · JSConf China 2017
• BPJS: Spezial – Einführung in Next.js
• Weiter für Next.js
• Datenmanagement mit Next.js und GraphQL
• Next.js Benutzer registrieren
• Next.js-Crashkurs – Serverseitige Reaktion
• Next.js beherrschen – Videokurs mit mehr als 50 Lektionen zum Erstellen von Anwendungen mit Next.js und React.
• Next.js-Tutorial – Ausführliche Next.js-Tutorials.
• Next.js Conf 2020 – Alle Videos von der Next.js-Konferenz 2020
• Komplette App zum Bestellen von Lebensmitteln mit Hasura, Next.js und Vercel
• Wie verwende ich die Anmeldeinformationsauthentifizierung in Next.js mit NextAuth?

Projekte (Anfängerniveau)

• Full-Stack-Netflix-Klon in React, Tailwind CSS, Next.JS, Prisma, MongoDB, NextAuth und Vercel (2023)
• Erstellen und implementieren Sie eine moderne Next 13-Website mit Framer Motion und Tailwind CSS
• Nächstes js 13-Projekt – IMBb-Klon – nächstes js Rückenwind-CSS-Projekt – nextjs-Projekt
• Nächstes js 13-Projekt – Google-Klon (next.js 13, Rückenwind CSS 3, Google Search API, App-Router
• nächstes js-Projekt – Twitter-Klon
• Erstellen und Bereitstellen: TWITTER-Klon mit React, Tailwind, Next, Prisma, Mongo, NextAuth und Vercel (2023)
• NextJS 13-Tutorial: Erstellen Sie ein statisches Blog aus Markdown-Dateien
• Full Stack Airbnb-Klon mit Next.js 13 App Router: React, Tailwind, Prisma, MongoDB, NextAuth 2023
• Echtzeit-Messenger-Klon: Next.js 13, React, Tailwind, Prisma, MongoDB, NextAuth, Pusher (2023)
• Full Stack Spotify Clone: ​​Next 13.4, React, Stripe, Supabase, PostgreSQL, Tailwind (2023)
• Full Stack E-Commerce + Dashboard & CMS: Next.js 13 App Router, React, Tailwind, Prisma, MySQL, 2023

Newsletter

• Next.js-News – Monatlicher Next.js-Newsletter mit neuen und kommenden Funktionen, besten Artikeln, Tools und Plugins.
• Next.js-Notizen – Monatliche Neuigkeiten zu Next.js und der JavaScript-Plattform.

Mitwirken

Haben Sie ein tolles Paket, einen Artikel, einen Blog, ein Video usw. gefunden? Schicken Sie mir eine Pull-Anfrage! Befolgen Sie einfach die Richtlinien. Danke schön!

---

Schauen Sie sich meinen Blog an oder sagen Sie Hallo auf Twitter.

Lizenz