Wir erstellen unser erstes Directus-Projekt

Um mit Directus zu starten, ist die einfachste Lösung, die kostenlose Community Cloud zu nutzen. Directus selbst ist Open Source und kann natürlich auch händisch auf jedem Server installiert werden. Den Quellcode für den eigenen Server finden wir hier.

Stellenmarkt
  1. Automotive Projektleiter* Softwareentwicklung Backend Services (m/w/d)
    EDAG Engineering GmbH, Ingolstadt
  2. Softwareintegrator / Systemintegrator C# & .NET Maschinenbau (m/w/d)
    Packsize GmbH, Herford, Bielefeld, Gütersloh, Paderborn, Lippstadt
Detailsuche

Für alle ohne Server geht es hier weiter: Account erstellen, Projekt als Community Cloud erstellen - fertig!

Am besten auch hier erst das Demo Project auswählen. Einstellungen, Collections und Daten, die uns helfen, das System zu verstehen und die API auszuprobieren, werden bereits hinterlegt.

  • Die Directus-Ansicht, um die Collections zu verwalten (Screenshot: Jonathan Schneider)
  • KPI und strukturierte Daten werden hier erstellt. (Screenshot: Jonathan Schneider)
  • Events für die Webhooks werden über diese Seite angelegt. (Screenshot: Jonathan Schneider)
  • Ein neues Projekt in der Directus Cloud anlegen (Screenshot: Jonathan Schneider)
  • Postman Request, um alle Artikel zu erhalten (Screenshot: Jonathan Schneider)
  • Postman Request für gefilterte Artikel (Screenshot: Jonathan Schneider)
  • Postman Request für sortierte Artikel (Screenshot: Jonathan Schneider)
Ein neues Projekt in der Directus Cloud anlegen (Screenshot: Jonathan Schneider)

Die REST- und GraphQL-API anbinden

Haben wir unseren Directus-Server am Laufen und mit diversen Daten gefüllt, können wir uns um das Herzstück kümmern: die API. Prinzipiell ist eine API oft ein aufwendiger Prozess, der händisch angelegt und definiert werden muss. Directus macht es uns aber einfach und stellt automatisch für jede Collection einen Endpoint zur Verfügung, den wir filtern, sortieren oder erweitern können.

Golem Karrierewelt
  1. Adobe Photoshop Aufbaukurs: virtueller Zwei-Tage-Workshop
    25./26.08.2022, Virtuell
  2. Hands-on C# Programmierung: virtueller Zwei-Tage-Workshop
    13./14.09.2022, virtuell
Weitere IT-Trainings

Möchten wir zum Beispiel alle Artikel unserer Collection namens Articles erhalten, wäre dies der folgende GET-Aufruf:

{{ DOMAIN }}/items/articles

  • Die Directus-Ansicht, um die Collections zu verwalten (Screenshot: Jonathan Schneider)
  • KPI und strukturierte Daten werden hier erstellt. (Screenshot: Jonathan Schneider)
  • Events für die Webhooks werden über diese Seite angelegt. (Screenshot: Jonathan Schneider)
  • Ein neues Projekt in der Directus Cloud anlegen (Screenshot: Jonathan Schneider)
  • Postman Request, um alle Artikel zu erhalten (Screenshot: Jonathan Schneider)
  • Postman Request für gefilterte Artikel (Screenshot: Jonathan Schneider)
  • Postman Request für sortierte Artikel (Screenshot: Jonathan Schneider)
Postman Request, um alle Artikel zu erhalten (Screenshot: Jonathan Schneider)

Da wir diesen Call ohne eine Authentifizierung durchführen, müssen wir erst in der Benutzerverwaltung prüfen, ob die Rolle Public die Articles auch lesen darf. Nur dann erhalten wir eine positive Rückmeldung, andernfalls müssten wir ein sogenanntes JSON Web Token von einem Nutzer übermitteln, der die Berechtigung besitzt.

Wir können auch direkt Filter anhängen, um beispielsweise nur die Artikel zu erhalten, die im Status "draft" liegen.

{{ DOMAIN }}/items/articles?filter[status][_eq]=draft

  • Die Directus-Ansicht, um die Collections zu verwalten (Screenshot: Jonathan Schneider)
  • KPI und strukturierte Daten werden hier erstellt. (Screenshot: Jonathan Schneider)
  • Events für die Webhooks werden über diese Seite angelegt. (Screenshot: Jonathan Schneider)
  • Ein neues Projekt in der Directus Cloud anlegen (Screenshot: Jonathan Schneider)
  • Postman Request, um alle Artikel zu erhalten (Screenshot: Jonathan Schneider)
  • Postman Request für gefilterte Artikel (Screenshot: Jonathan Schneider)
  • Postman Request für sortierte Artikel (Screenshot: Jonathan Schneider)
Postman Request für gefilterte Artikel (Screenshot: Jonathan Schneider)

Auch Sortieren ist ganz einfach möglich über folgenden Aufruf:

{{ DOMAIN }}/items/articles?sort=sort,-date_created

  • Die Directus-Ansicht, um die Collections zu verwalten (Screenshot: Jonathan Schneider)
  • KPI und strukturierte Daten werden hier erstellt. (Screenshot: Jonathan Schneider)
  • Events für die Webhooks werden über diese Seite angelegt. (Screenshot: Jonathan Schneider)
  • Ein neues Projekt in der Directus Cloud anlegen (Screenshot: Jonathan Schneider)
  • Postman Request, um alle Artikel zu erhalten (Screenshot: Jonathan Schneider)
  • Postman Request für gefilterte Artikel (Screenshot: Jonathan Schneider)
  • Postman Request für sortierte Artikel (Screenshot: Jonathan Schneider)
Postman Request für sortierte Artikel (Screenshot: Jonathan Schneider)

Grundsätzlich können wir uns merken, dass alles, was wir in der Admin-Oberfläche eingeben, auch über die API - im gewünschten Format - abgerufen werden kann.

Alle Details zu den Möglichkeiten der API finden sich in den offiziellen Docs.

Möglichkeiten eines Headless CMS

Directus ist in seiner Version 9 bereits ein sehr ausgearbeitetes System und bietet damit viele Funktionalitäten, die man sich von einem Headless CMS wünschen kann.

Natürlich ist ein Headless CMS nicht die richtige Wahl für jede Problemstellung. Möchten wir eine normale Webseite entwickeln, ist unsere Wahl wahrscheinlich eher ein klassisches CMS. Müssen wir aber eher einen Produktkatalog entwickeln, welcher später auf der Webseite mit diversen Produktfiltern angezeigt wird, und sollen die Vertriebsmitarbeiter mit einer App ausgestattet werden, um den Kunden zügig und schnell das richtige Produkt zu verkaufen, kann es sinnvoll sein, eher ein Headless CMS einzusetzen.

Handbuch für Softwareentwickler: Das Standardwerk für professionelles Software Engineering

Der große Vorteil liegt auf der Hand: Ändern wir die Produktbeschreibung in Directus, ändert es sich automatisch auf jedem Ausgabekanal, der über die Directus-API angebunden wird.

Wir selbst können steuern, welche Struktur und Felder für unseren Produktkatalog relevant sind und welche Daten zu einem Produkt gehören. Es benötigt keine Vorlage, von der wir nur die Hälfte ausfüllen; wir selbst können die Vorlage und Felder definieren.

Habt ihr schon mal mit einem Headless CMS oder sogar mit Directus gearbeitet?

Jonathan Schneider ist Web-/App-Entwickler und arbeitet seit über zehn Jahren im Bereich Entwicklung und Programmierung, mit der Spezialisierung auf Frontend.

Bitte aktivieren Sie Javascript.
Oder nutzen Sie das Golem-pur-Angebot
und lesen Golem.de
  • ohne Werbung
  • mit ausgeschaltetem Javascript
  • mit RSS-Volltext-Feed
 Directus: Schneller zur Backend-API mit dem Headless CMS
  1.  
  2. 1
  3. 2


Schnarchnase 29. Jun 2022 / Themenstart

Ich kenne weder Flask noch FastAPI, aber Directus ist kein Framework sondern ein CMS. Du...

Schnarchnase 29. Jun 2022 / Themenstart

Du kannst einer Collection (Tabelle) ein Status-Feld geben und die Berechtigung eine...

mnementh 29. Jun 2022 / Themenstart

Ich arbeite gerade mit Directus und ehrlich gesagt, der ganze Punkt ist ja, dass man ein...

timtarre 29. Jun 2022 / Themenstart

Nicht so sehr, wie man vermuten würde. Ich bin quasi gelernter Frontendler, arbeite aber...

Kommentieren



Aktuell auf der Startseite von Golem.de
Elektromobilität
Wohnmobile werden unter Strom gesetzt

Auf dem Caravan-Salon in Düsseldorf werden die ersten Wohnmobile mit Elektroantrieb gezeigt. Doch die Branche tut sich schwer mit der Antriebswende.
Ein Bericht von Franz W. Rother

Elektromobilität: Wohnmobile werden unter Strom gesetzt
Artikel
  1. Nuvia: Qualcomm will erneut Server-CPUs bauen
    Nuvia
    Qualcomm will erneut Server-CPUs bauen

    Neuer Anlauf nach den gescheiterten Centriq 2400: Qualcomm soll an Server-Chips mit Nuvia-Kernen arbeiten, Unterstützung gibt es von Amazon.

  2. Hacking: Der Bad-USB-Stick Rubber Ducky wird noch gefährlicher
    Hacking
    Der Bad-USB-Stick Rubber Ducky wird noch gefährlicher

    Mit einer neuen Version des Bad-USB-Sticks Rubber Ducky lassen sich Rechner noch leichter angreifen und neuerdings auch heimlich Daten ausleiten.

  3. Maxus ET90: Europas erster elektrischer Pick-up ist da
    Maxus ET90
    Europas erster elektrischer Pick-up ist da

    Der Maxus eT90 ist ein elektrischer Pick-up, der Ende 2022 mit fünf Sitzplätzen und großem Akku auf den europäischen Markt kommen soll.

Du willst dich mit Golem.de beruflich verändern oder weiterbilden?
Zum Stellenmarkt
Zur Akademie
Zum Coaching
  • Schnäppchen, Rabatte und Top-Angebote
    Die besten Deals des Tages
    Daily Deals • MindStar (MSI RTX 3090 Gaming 1.269€, Seagate Festplatte ext. 18 TB 295€) • PS5-Deals (Uncharted Legacy of Thieves 15,38€, Horzizon FW 39,99€) • HP HyperX Gaming-Maus -51% • Alternate (Kingston Fury DDR5-6000 32GB 219,90€ statt 246€) • Samsung Galaxy S22+ 5G 128 GB 839,99€ [Werbung]
    •  /