Wenn Sie Scrivito ausprobieren oder Ihre eigene Scrivito-basierte Website erstellen möchten, haben wir eine mit viel Funktionalität ausgestattete Beispielanwendung für Sie, die Sie lokal installieren können. So können Sie sich ein Bild davon machen, wie leicht eine Web-Anwendung mit Scrivito entwickelt werden kann.
Die Example App erfordert etwas Erfahrung im Bereich der Web-Entwicklung, Sie brauchen jedoch kein JavaScript-Experte zu sein, um diese App nutzen zu können!
Falls nocht nicht geschehen, registrieren Sie sich bitte bei JustRelate auf my.scrivito.com und legen Sie eine Instanz an, um Website-Inhalte speichern und abrufen zu können.
Klonen Sie die Example App auf https://github.com/Scrivito/scrivito_example_app_js oder laden Sie sie dort herunter. Um sie zu klonen, öffnen Sie ein Terminal, wechseln Sie in das Verzeichnis, in dem Ihre Projekte liegen, und führen Sie dann Folgendes aus:
Hierdurch wird ein Unterverzeichnis angelegt, das denselben Namen wie das Repository trägt, „scrivito_example_app_js“.
Auf Ihrem Rechner müssen node (>= 12.0.0) und npm (>= 7.0.0) installiert sein. Für beides können Sie ein Installationsprogramm von https://nodejs.org/en/download/ herunterladen oder die Komponenten einzeln installieren, wenn Sie Homebrew verwenden. Da node auch npm enthält, dürfte Folgendes ausreichen:
Lassen Sie nun npm sämtliche Module installieren, von denen die App abhängt:
Die Example App benötigt die ID Ihrer Scrivito-Instanz. Um sie zu ermitteln und anzugeben, gehen Sie folgendermaßen vor:
SCRIVITO_TENANT= ein. Speichern Sie dann die Datei unter dem Namen „.env“ ab. Ihr Inhalt sollte folgendermaßen aussehen:Damit Ressourcen zwischen Ihrem CMS und Ihrer Web-Anwendung geteilt werden können, geben Sie die URL(s) Ihrer App im Reiter „Trusted origins“ der Console an. Klicken Sie auf „Add origin”, um einen weiteren CORS-Origin oder eine weitere URL einzutragen, unter der auf Ihre App zugegriffen wird, etwa http://localhost:8080.
Für die App-Entwicklung können Sie einen lokalen Webserver starten. Führen Sie hierfür aus dem Projektverzeichnis der Example App heraus Folgendes aus:
Dies öffnet http://localhost:8080 in Ihrem Standard-Browser. Änderungen, die am „src“-Unterverzeichnis vorgenommen werden, bewirken, dass die App mit der aktuellen Seite neu geladen wird.
Fehler in der App, verursacht beispielsweise durch nicht richtig funktionierende React-Komponenten, werden in der Browser-Konsole ausgegeben, nicht im Terminal-Fenster. In letzterem werden lediglich Fehler beim Kompilieren, Probleme mit verwendeten Bibliotheken etc. protokolliert.
Wenn alles nach Plan verlaufen ist, können Sie nun Ihre Example Application nutzen! Um Inhalte mit der Benutzeroberfläche zu erstellen oder zu bearbeiten, öffnen Sie einfach edit.scrivito.com in Ihrem Browser und geben http://localhost:8080/ als die URL Ihrer App an.
Beachten Sie bitte, dass das Layout, Design und Bildmaterial der Example App gelegentlich aktualisiert werden, um aktuellen Trends, neuen Einsatzgebieten usw. Rechnung zu tragen.
Sämtliche Website-Inhalte können in Arbeitskopien erstellt und bearbeitet werden. Mit Hilfe der Leiste auf der rechten Seite können Sie Arbeitskopien anlegen und veröffentlichen oder die Liste der Änderungen öffnen, um zu sehen, was bis jetzt geändert wurde. Erfahren Sie mehr über Arbeitskopien und die veröffentlichten Inhalte.
Scrivitos Web-Interface zur Bearbeitung von Inhalten ist leicht zu bedienen: Wandern Sie mit dem Mauszeiger über die Seite, um die Widget-Rahmen sichtbar zu machen. Klicken Sie auf eines der Plus-Zeichen auf einem Rahmen, um ein Widget hinzuzufügen, oder verwenden Sie den kleinen „Griff“ rechts oben, um das Widget-Menü zu öffnen oder das Widget an eine andere Stelle auf der Seite zu ziehen. In der Anleitung für Redakteure finden Sie viele weitere nützliche Tipps.