Directus: Schneller zur Backend-API mit dem Headless CMS

Web-, Mobile- oder gar Print-Frontends können sehr verschieden sein. Eine Backend-API mit einem Headless CMS vereinfacht das. Directus zeigt, wie.

Eine Anleitung von Jonathan Schneider veröffentlicht am
Das Maskottchen von Directus ist ein Hase.
Das Maskottchen von Directus ist ein Hase. (Bild: Pixabay/Montage: Golem.de)

Directus ist ein sogenanntes Headless CMS, mit dem wir strukturierte Daten eigenständig definieren und diese automatisch über eine API bereitstellen können. Zudem ist es kombiniert mit einer übersichtlichen Admin-Oberfläche auf Basis von Vue.js, die definitiv einen Blick wert ist.

Inhalt:
  1. Directus: Schneller zur Backend-API mit dem Headless CMS
  2. Wir erstellen unser erstes Directus-Projekt

Wofür steht eigentlich Headless CMS? Der Name CMS (Content Management System) ist vielen ein Begriff. Es ist eine Softwarelösung, die einen typischen Anwendungsfall aus einer Datenschicht mit Backend und Frontend kombiniert, welches die Daten visuell aufbereitet. Wordpress ist ein sehr bekanntes Beispiel.

Ein Headless CMS konzentriert sich hingegen viel mehr auf die Daten und das Backend, wobei das Frontend erst gar nicht mitgeliefert wird. Nach dem Prinzip: Definiere dein Schema, speichere deine Daten und hier ist die Schnittstelle.

Dies kann theoretisch erst mal als Nachteil empfunden werden, ist aber bei genauerer Betrachtung eher ein großer Vorteil. Ballast wird zurückgelassen und wir können selbst entscheiden, wohin unsere Daten ausgespielt werden. Eine App, eine Webseite, ein automatisiertes Printprodukt? Kein Problem. Den Ausgabekanal können wir über die flexible API technologisch und strategisch selbst bestimmen.

Stellenmarkt
  1. Mitarbeiter QS Apothekensoftware (m/w/d)
    NOVENTI Health SE, Bietigheim-Bissingen, Mannheim, Oberhausen
  2. IT-Referent (w/m/d)
    Bundeskartellamt, Bonn
Detailsuche

Ein Headless CMS ist somit eher eine Datenquelle mit der richtigen Verfügbarkeit nach außen. Es wird aber nicht nur ohne Frontend geliefert und mit einer API, sondern konzentriert sich sehr stark auf die Verwaltung der Daten. Wir befinden uns sehr nah an der Datenschicht - nur eben mit einer UI.

Directus Version 9: Die Zukunft spricht Javascript

Im Gegensatz zu Directus 8, das noch auf PHP basierte, ist die Version 9 rein in Javascript umgesetzt. Sprich: Alles basiert auf einem Technologie-Stack, was besonders Frontend-Entwickler freuen wird.

Wir benötigen somit nur noch einen Node-Server und eine klassische Datenbank (z. B. MySQL). Wir installieren die Open-Source-Anwendung auf unserem Server oder nutzen direkt die kostenlose Community Cloud.

Directus 9 ist aus zwei Blinkwinkeln interessant.

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

Die Besonderheiten von Directus 9

Es bietet eine sehr saubere und flexible Admin-Oberfläche, in der wir unser Datenschema definieren (sogenannte Collections), aber zugleich auch die Daten verwalten können. Mitarbeiter und Redakteure werden sich auch ohne technisches Know-how gut in der Admin-Oberfläche zurechtfinden, um den Content zu verwalten.

Die richtigen Benutzerrollen, die wir alle eigenständig definieren können, steuern auch hier wieder die Rechte. Möglicherweise dürfen technische Admins Collections verändern, wohingegen die Redakteure natürlich nur Daten in die vordefinierte Struktur ablegen dürfen.

  • 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)
Die Directus-Ansicht, um die Collections zu verwalten (Screenshot: Jonathan Schneider)

Unmittelbar in Directus können auch eigene KPIs und Dashboards definiert werden, die abgelegte Daten aufbereiten oder filtern. Das ist praktisch für jeden Controller, der zwar keine Daten bearbeiten möchte, aber direkt im System eine Auswertung aller verfügbaren Produkte, Beiträge oder anderer Daten erhalten möchte.

  • 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)
KPI und strukturierte Daten werden hier erstellt. (Screenshot: Jonathan Schneider)

Natürlich verfügen die Datensätze auch über Revisionen, die uns helfen, jederzeit Änderungen zu speichern beziehungsweise einen alten Stand wieder herzustellen.

Mit sogenannten Webhooks können wir auf verschiedene Ereignisse reagieren oder weitere Prozesse auslösen. Soll ein Newsletter erzeugt werden, wenn ein neuer Artikel angelegt wurde? Kein Problem, der Webhook wird ausgelöst und ruft eine hinterlegte URL auf.

  • 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)
Events für die Webhooks werden über diese Seite angelegt. (Screenshot: Jonathan Schneider)

Mehrsprachigkeit ist ein großes Thema und darf natürlich auch nicht außer Acht gelassen werden. In Directus kann jede Collection und jeder Datensatz in beliebig viele Sprachen übersetzt und später über die API gesondert abgerufen werden.

Wer mit Directus arbeitet, merkt schnell, dass an jede Eventualität, jeden Datentyp und jede Relation gedacht wurde - und wir sprechen hier nur über die Admin-Oberfläche. Die Magie passiert unter der Haube und zielt auf die API ab, die sich automatisch durch unsere angelegten Collections erzeugt.

Bitte aktivieren Sie Javascript.
Oder nutzen Sie das Golem-pur-Angebot
und lesen Golem.de
  • ohne Werbung
  • mit ausgeschaltetem Javascript
  • mit RSS-Volltext-Feed
Wir erstellen unser erstes Directus-Projekt 
  1. 1
  2. 2
  3.  


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
Google Fonts
Abmahnungen an Webseitenbetreiber mit Google-Schriftarten

Nach einer Entscheidung des Landgerichts München erhalten Webseitenbetreiber mit eingebundenen Google Fonts vermehrt Abmahnungen.

Google Fonts: Abmahnungen an Webseitenbetreiber mit Google-Schriftarten
Artikel
  1. Paw Patrol: US Space Force schickt Roboterhunde auf Patrouille
    Paw Patrol
    US Space Force schickt Roboterhunde auf Patrouille

    Die US Space Force wird einen hundeähnlichen Roboter von Ghost Robotics auf Patrouille schicken, um Personalkosten zu senken.

  2. Programmiersprache: JSON-Erfinder will Javascript in Rente schicken
    Programmiersprache
    JSON-Erfinder will Javascript in Rente schicken

    Douglas Crockford, der Erfinder des Datenformats JSON und Mitentwickler von Javascript, findet, dass die Sprache in Rente geschickt werden sollte.

  3. Windows auf dem Mac: Parallels wird merklich teurer
    Windows auf dem Mac
    Parallels wird merklich teurer

    Parallels 18 bietet eine native Unterstützung für Windows 11 und eine bessere Ressourcenzuweisung. Allerdings wird die Software teurer.

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 • Günstig wie nie: WD SSD 1TB m. Kühlkörper (PS5) 119,90€, MSI 29,5" 200 Hz 259€, LG QNED 75" 120 Hz 1.455,89€ • MindStar (XFX RX 6950 XT 999€, Gainward RTX 3070 559€) • Gigabyte Deals • Der beste Gaming-PC für 2.000€ • Apple Week bei Media Markt • be quiet! Deals [Werbung]
    •  /