StudioCMS verwendet @astrojs/db, um sich mit deiner libSQL-Datenbank zu verbinden. Du kannst jeden libSQL-Anbieter oder einen selbst gehosteten libSQL-Server verwenden.
Wenn du die StudioCMS CLI verwendest, kannst du diesen Schritt überspringen und die CLI verwenden, um eine neue Datenbank zu erstellen, wenn du die Turso CLI installiert hast.
libSQL unterstützt sowohl HTTP als auch WebSockets als Transportprotokoll für einen entfernten Server. Sie unterstützt auch die Verwendung einer lokalen Datei oder einer In-Memory-DB.
Erstellen eines StudioCMS-Projekts mit dem Befehl create
Um mit StudioCMS ein neues Astro-Projekt mit einer unserer vorgefertigten Vorlagen zu erstellen, führst du einfach den folgenden Befehl in deinem Terminal aus:
Nachdem du den Befehl ausgeführt hast, wirst du aufgefordert, ein paar Fragen zu deinem Projekt zu beantworten. Danach erstellt das CLI ein neues Astro-Projekt mit StudioCMS im angegebenen Verzeichnis.
Danach wirst du aufgefordert, die nächsten Schritte zu befolgen. Dazu gehört, dass du sicherstellst, dass deine Umgebungsvariablen richtig gesetzt sind und dass du das Projekt ausführst, um die Einrichtung abzuschließen.
Nachdem du das CLI ausgeführt hast, vergewissere dich, dass deine astro.config.mjs-Datei richtig konfiguriert ist:
Your final, deployed URL. Astro uses this full URL to generate your sitemap and canonical URLs in your final build. It is strongly recommended that you set this configuration to get the most out of Astro.
Deploy to your favorite server, serverless, or edge host with build adapters. Import one of our first-party adapters for Netlify, Vercel, and more to engage Astro SSR.
Extend Astro with custom integrations. Integrations are your one-stop-shop for adding framework support (like Solid.js), new features (like sitemaps), and new libraries (like Partytown).
Read our Integrations Guide for help getting started with Astro Integrations.
Nachdem du den Befehl ausgeführt hast, wirst du aufgefordert, ein paar Fragen zu deinem Projekt zu beantworten. Danach erstellt das CLI ein neues Astro-Projekt im angegebenen Verzeichnis.
Du solltest die Meldung „Liftoff confirmed. Explore your project!“, gefolgt von einigen empfohlenen nächsten Schritten.
cd in dein neues Projektverzeichnis, um Astro zu verwenden.
Terminal-Fenster
cdmy-project
Wenn du den npm-Installationsschritt während des CLI-Assistenten übersprungen hast, musst du deine Abhängigkeiten installieren, bevor du fortfährst.
Um die StudioCMS-Integration zu deinem Projekt hinzuzufügen, musst du das StudioCMS-Paket und seine Abhängigkeiten installieren:
Your final, deployed URL. Astro uses this full URL to generate your sitemap and canonical URLs in your final build. It is strongly recommended that you set this configuration to get the most out of Astro.
Deploy to your favorite server, serverless, or edge host with build adapters. Import one of our first-party adapters for Netlify, Vercel, and more to engage Astro SSR.
Extend Astro with custom integrations. Integrations are your one-stop-shop for adding framework support (like Solid.js), new features (like sitemaps), and new libraries (like Partytown).
Read our Integrations Guide for help getting started with Astro Integrations.
Nachdem du den Befehl ausgeführt hast, wirst du aufgefordert, ein paar Fragen zu deinem Projekt zu beantworten. Danach erstellt das CLI ein neues Astro-Projekt im angegebenen Verzeichnis.
Du solltest die Meldung „Liftoff confirmed. Explore your project!“, gefolgt von einigen empfohlenen nächsten Schritten.
cd in dein neues Projektverzeichnis, um Astro zu verwenden.
Terminal-Fenster
cdmy-project
Wenn du den npm-Installationsschritt während des CLI-Assistenten übersprungen hast, musst du deine Abhängigkeiten installieren, bevor du fortfährst.
Um die StudioCMS-Integration in dein Projekt zu integrieren, musst du das Astro StudioCMS-Paket und seine Abhängigkeiten installieren:
Your final, deployed URL. Astro uses this full URL to generate your sitemap and canonical URLs in your final build. It is strongly recommended that you set this configuration to get the most out of Astro.
Deploy to your favorite server, serverless, or edge host with build adapters. Import one of our first-party adapters for Netlify, Vercel, and more to engage Astro SSR.
Extend Astro with custom integrations. Integrations are your one-stop-shop for adding framework support (like Solid.js), new features (like sitemaps), and new libraries (like Partytown).
Read our Integrations Guide for help getting started with Astro Integrations.
@see ― The StudioCMS Docs for more information on how to use StudioCMS.
studioCMS(),
],
});
Bitte beachte, dass die Option site in der Datei astro.config.mjs erforderlich ist, damit StudioCMS korrekt funktioniert. Du kannst hier die URL deiner Website oder eine Platzhalter-URL angeben. (z.B. https://demo.studiocms.dev/ oder http://localhost:4321/)
Um oAuth-Anbieter einzurichten, benötigen sie eine Callback-URL. Die Callback-URL ist der Pfad, an den der Anbieter den Nutzer nach der Authentifizierung weiterleiten wird.
Richte deine package.json-Skripte so ein, dass sie das --remote-Flag für Build und optional für die Entwicklung enthalten. (Du kannst den Entwicklungsbefehl auch so ausführen, wie im Abschnitt „Ausführen deines StudioCMS-Projekts“ gezeigt).
Dank der Leistungsfähigkeit von Astro ist der Betrieb von StudioCMS so einfach wie das Ausführen des Entwickelungsbefehls für die lokale Vorschau oder das Erstellen und Bereitstellen auf deinem Server.
Erstmalige Einrichtung (oder bei Aktualisierungen, wenn das Tabellenschema aktualisiert wird)
Nachdem du die Befehle ausgeführt hast, solltest du eine Meldung sehen, die besagt, dass dein Projekt unter localhost:4321 läuft. Wenn du StudioCMS zum ersten Mal einrichtest, wirst du aufgefordert, die Konfiguration von StudioCMS unter http://localhost:4321/start abzuschließen.
Nachdem du den Befehl ausgeführt hast, solltest du eine Meldung sehen, die besagt, dass dein Projekt unter localhost:4321 läuft. Öffne deinen Browser und navigiere zu http://localhost:4321, um dein Astro-Projekt in Aktion zu sehen.
Glückwunsch! 🥳 Du hast jetzt StudioCMS in deinem Astro-Projekt installiert.
Hinzufügen eines Frontends zu deinem StudioCMS-Projekt
StudioCMS ist ein Headless Astro CMS, d.h. du musst dein eigenes Frontend bereitstellen, um die Inhalte anzuzeigen. Wenn du ein bereits fertiges Frontend suchst, kannst du unsere Plugins im Paket-Katalog ausprobieren.
A utility function to define the StudioCMS config object.
This function is used to define the optional StudioCMS
config object in the Astro project root. The expected file
name is studiocms.config.mjs. And it should be adjacent
to the Astro project's astro.config.mjs file.
StudioCMS will attempt to import this file and use the default
export as the StudioCMS config object automatically if it exists.
Using this function is optional, but it can be useful for IDEs
to provide better intellisense and type checking.
A utility function to define the StudioCMS config object.
This function is used to define the optional StudioCMS
config object in the Astro project root. The expected file
name is studiocms.config.mjs. And it should be adjacent
to the Astro project's astro.config.mjs file.
StudioCMS will attempt to import this file and use the default
export as the StudioCMS config object automatically if it exists.
Using this function is optional, but it can be useful for IDEs
to provide better intellisense and type checking.
Nachdem du die Schritte für die Ersteinrichtung ausgeführt hast, solltest du dein StudioCMS-Projekt erstellen und auf deinem Server bereitstellen.
Standardmäßig ist das Dashboard von StudioCMS unter http://your-domain.tld/dashboard verfügbar.
Dieses Dashboard steht dir zur Verfügung, um deine Inhalte und Einstellungen im Entwicklungs- und Produktionsmodus zu verwalten.
Es wird empfohlen, StudioCMS nur im Produktionsmodus zu verwenden, da das Dashboard für das erstellte Projekt gedacht ist. (Im Entwicklungsmodus können einige Probleme/Fehler auftreten, z. B. ein Vite Entwicklungsfehler).