next enterprise

Next.js Enterprise -Kesselplatte

Willkommen zum nächsten . Es ist mit Funktionen beladen, mit denen Sie eine Hochleistungs-, Wartungs- und angenehme App erstellen können. Wir haben das ganze schwere Heben für Sie gemacht, also lehnen Sie sich zurück, entspannen Sie sich und machen Sie sich bereit, die Welt mit Ihrer unglaublichen App zu erobern! ?

Notiz

Blazity ist eine Gruppe von Next.js/Headless Experten. Kontaktieren Sie uns unter [email protected], wenn Sie über Ihr Projekt sprechen möchten oder nur mit uns plaudern möchten

Merkmale

Mit dieser Vorlage erhalten Sie all die Großartigkeit, die Sie brauchen:

• ? ️ Next.js - standardmäßig schnell, mit Konfiguration optimiert für die Leistung (mit App -Verzeichnis )
• ? Tailwind CSS - Ein Utility -First CSS -Framework für die schnelle UI -Entwicklung
• Eslint und schöner - für sauberen, konsistenten und fehlerfreien Code
• Extrem streng typeskript - mit ts-reset -Bibliothek für die ultimative Art Sicherheit
• GitHub -Aktionen - Vorkonfigurierte Aktionen für reibungslose Workflows, einschließlich Bündelgröße und Leistungsstatistiken
• ? Perfekter Leuchtturmbewertung - weil Performance wichtig ist
• Bündelanalysator Plugin - Behalten Sie Ihre Bündelgröße im Auge
• Scherz- und React -Testbibliothek - für steinlösliche Einheiten und Integrationstests
• Dramatiker -Schreiben Sie End-to-End-Tests wie ein Profi
• Storybook - Erstellen, testen und präsentieren Sie Ihre Komponenten
• Rauchprüfungs- und Akzeptanztests - für Vertrauen in Ihre Bereitstellungen
• Konventionelle Commits Git Hook - Halten Sie Ihre Commit -Geschichte ordentlich und ordentlich
• Beobachtbarkeit - Offene Telemetrie -Integration für die nahtlose Überwachung
• Absolute Importe - keine Spaghetti -Importe mehr
• Gesundheitsprüfungen - Kubernetes -kompatibel für robuste Bereitstellungen
• Radix UI - Headless UI -Komponenten für endlose Anpassung
• CVA - Erstellen Sie ein konsistentes, wiederverwendbares und atomisches Designsystem
• Renovate Bot - Auto -Updating -Abhängigkeiten, damit Sie sich auf die Codierung konzentrieren können
• Patch -Package - Externe Abhängigkeiten beheben, ohne Ihren Verstand zu verlieren
• Komponenten Kopplungs- und Kohäsionsgraphen - Ein Werkzeug zum Verwalten von Komponentenbeziehungen
• Automatisierte Chatgpt -Code -Bewertungen - Bleiben Sie mit AI -betriebenen Code -Bewertungen auf dem neuesten Stand!
• Semantische Veröffentlichung - für automatische ChangeLog
• T3 Env - Verwalten Sie Ihre Umgebungsvariablen mühelos

Inhaltsverzeichnis

• Next.js Enterprise -Kesselplatte
  • Merkmale
  • Inhaltsverzeichnis
  • Erste Schritte
  • Einsatz
  • Skripteübersicht
  • Kupplungsdiagramm
  • Testen
    • Auslauftests
    • Akzeptanztests
    • Rauchprüfung
  • Styling- und Designsystem
    • CVA - Ein neuer Ansatz für Varianten
  • Staatsmanagement
    • Zustand
    • Jotai
    • Rückstoß
  • CHATGPT -Code -Bewertung
  • Umgebungsvariablen Handhabung
  • Beitrag
  • Unterstützung
  • Lizenz
  • Mitwirkende

Erste Schritte

Befolgen Sie die folgenden Schritte, um mit dieser Kesselplatte zu beginnen:

1. Fork & Clone -Repository:

 # # Don't forget to  star and fork it first :)
git clone https://github.com/ < your_username)/next-enterprise.git

2. Installieren Sie die Abhängigkeiten:

yarn install --frozen-lockfile

3. Führen Sie den Entwicklungsserver aus:

yarn dev

4. Öffnen Sie http: // localhost: 3000 mit Ihrem Browser, um das Ergebnis zu sehen.

5. Dieses Projekt verwendet einen Git -Hook, um konventionelle Commits durchzusetzen. Führen Sie den folgenden Befehl im Stammverzeichnis des Projekts aus, um den Git -Hook zu installieren:

brew install pre-commit
pre-commit install -t commit-msg

Einsatz

Stellen Sie einfach Ihre nächste.js -App mit Vercel ein, indem Sie auf die folgende Schaltfläche klicken:

? Skripteübersicht

Die folgenden Skripte sind im package.json verfügbar:

• dev : Startet den Entwicklungsserver mit farbiger Ausgabe
• build : Erstellt die App für die Produktion
• start : Startet den Produktionsserver
• lint : FININT den Code mit Eslint
• lint:fix : Beheben Sie automatische Fehlerfehler
• prettier : Überprüft den Code auf ordnungsgemäße Formatierung
• prettier:fix : Behebt automatisch die Formatierung von Problemen
• analyze : Analysiert die Bündelgrößen für Client-, Server- und Kantenumgebungen
• storybook : Startet den Storybook -Server
• build-storybook : Erstellt das Storybook zur Bereitstellung
• test : Führen Sie Einheiten- und Integrationstests aus
• e2e:headless : Läuft End-to-End-Tests im kopflosen Modus aus
• e2e:ui : Führen Sie End-to-End-Tests mit UI durch
• format : formatiert den Code mit schöneren
• postinstall : Wendet Patches auf externe Abhängigkeiten an
• preinstall : Stellen Sie sicher, dass das Projekt mit Garn installiert ist
• coupling-graph : Erzeugt eine Kupplungs- und Kohäsionsgrafik für die Komponenten

? Kupplungsdiagramm

Das coupling-graph -Skript ist ein nützliches Tool, mit dem die Kopplung und Verbindungen zwischen den internen Modulen Ihres Projekts visualisieren können. Es wurde mit der Madge -Bibliothek gebaut. Um das Diagramm zu generieren, führen Sie einfach den folgenden Befehl aus:

yarn coupling-graph

Dadurch wird eine graph.svg -Datei erstellt, die eine grafische Darstellung der Verbindungen zwischen Ihren Komponenten enthält. Sie können die Datei mit jedem SVG-kompatiblen Betrachter öffnen.

Fügen Sie Ihre Beiträge hinzu