strapi starter next corporate

⛔ veraltet

Dieses Repository ist nicht mehr gewartet und funktioniert nur für Gurti V3. Sie finden die neueste Strapi V4-Version dieses Starters auf den Starter-and-Templates Monorepo.

---

Strapi Starter Nächster Unternehmensseite

Nächster Starter für die Erstellung einer Unternehmensseite mit Armbandi.

Sehen Sie sich die Live -Demo an. • Lesen Sie den Blog -Beitrag

Dieser Starter ist für Flexibilität ausgelegt. Mit der Verwendung können Sie Ihre Website -Inhalte vollständig in Strapi verwalten und eine nächste App automatisch generieren. Marketingteams können Seiten erstellen und ihr Layout ohne Hilfe von Entwicklern entwerfen.

Dieser Starter zeigt:

• Die Erstellung der Seiten innerhalb von Strapi, kein Code erforderlich
• Vollflexible Seitenstruktur: Entwerfen Sie die Seiten, die Sie mit UI -Abschnitten möchten
• 8 UI -Abschnitte außerhalb der Box: Held, Richtext, Largevideo, Testimonials, Preisgestaltung, Bottomactions, Menturerows, FeatureColumns
• Leicht zu thematisieren mit Rückenwind
• Statische Standortgenerierung mit dem nächsten
• Ein integrierter Vorschau -Modus, um Ihre Seiten vor der Veröffentlichung auf einer privaten URL anzuzeigen
• Inhalt in mehreren Sprachen mit i18n

Dieser Starter verwendet die Correnate -Unternehmensvorlage

Schauen Sie sich hier alle unsere Starter an

Erste Schritte

Verwenden Sie unsere create-strapi-starter -CLI, um Ihr Projekt zu erstellen.

npx create-strapi-starter@3 my-site next-corporate

Die CLI erstellt einen Monorepo, installiert Abhängigkeiten und führt Ihr Projekt automatisch aus.

Der nächste Frontend -Server wird hier ausgeführt => http: // localhost: 3000

Der Strapi -Backend -Server wird hier ausgeführt => http: // localhost: 1337

Vorschau -Modus

Sie können den Vorschau -Modus mit einer URL wie folgt einschalten:

http://localhost:3000/api/preview?secret=<preview-secret>&slug=<slug>

<preview-secret> ist das geheime Token, das in Ihrer .Env-Konfiguration definiert ist, <slug> ist der Schläger, den Sie für Ihre Seite in Strapi eingegeben haben.

Während sich der Vorschau -Modus befindet, können Sie auf draft zugreifen, genau wie Sie die Seiten published würden.

Beispielsweise wäre http: // localhost: 3000/geheim im Vorschaudermodus verfügbar.

Ein Banner bleibt unter der Navigation, um Ihnen darüber zu informieren, dass der Vorschau -Modus eingeschaltet ist, und es ermöglicht es Ihnen auch, ihn auszuschalten.

Passen Sie Ihre Unternehmensseite an

Um diese Website zu bearbeiten, müssen Sie sowohl das Frontend als auch das Backend in Ihrer Entwicklungsumgebung ausführen.

Hinzufügen von Abschnitten

Wir haben Abschnitte für Sie erstellt, aber Sie werden wahrscheinlich mehr hinzufügen möchten, um Ihren Anforderungen zu entsprechen. Folgen Sie folgenden Schritten:

• Erstellen Sie in der Kategorie "Abschnitte" eine neue Komponente in Gurti
• Öffnen Sie im Inhaltsbauer die Seitensammlung und überprüfen Sie Ihren neuen Abschnitt im Feld contentSections .
• Erstellen Sie eine React -Komponente, die eine data in /frontend/components/sections nimmt
• So verknüpfen Sie Ihren Strapi -Abschnitt mit dieser React -Komponente, öffnen /frontend/components/sections.js und fügen Sie dem Objekt sectionComponents einen Eintrag hinzu.

Benutzerdefiniertes Thema

Wir verwenden Rückenwind -CSS zum Styling. Um das Aussehen Ihrer Seite zu ändern, können Sie das Thema in /front/tailwind.config.js bearbeiten. Lesen Sie die Rückenwinddokumente, um alle Änderungen anzuzeigen, die Sie vornehmen können. Zum Beispiel können Sie die primäre Farbe wie folgt ändern:

 const { colors } = require ( `tailwindcss/defaultTheme` )

module . exports = {
  theme : {
    extend : {
      colors : {
        primary : colors . green ,
      } ,
    } ,
  } ,
} 

Bereitstellung zur Produktion

Sie müssen die frontend und backend -Projekte separat bereitstellen. Hier sind die Dokumente, um jeden einzelnen einzusetzen:

• Riemen einsetzen
• Next.js einsetzen

Vergessen Sie nicht, Ihre Umgebungsvariablen in Ihren Produktions -Apps einzurichten.

Hier sind die erforderlichen für das Frontend:

• NEXT_PUBLIC_STRAPI_API_URL : URL Ihres Strapi -Backends, ohne abgeschlossenes Schrägstrich
• PREVIEW_SECRET : Eine zufällige Zeichenfolge, die zum Schutz Ihrer Vorschauseiten verwendet wird

Und für das Backend:

• FRONTEND_URL : URL Ihrer Frontend, ohne nachgezogene Schrägstriche
• FRONTEND_PREVIEW_SECRET : Token of Next.js Vorschau -Modus im Frontend definiert

Viel Spaß mit diesem Starter!