Vollständig entkoppeltes Drupal: Der ultimative Leitfaden

Heutzutage konzentrieren sich Unternehmen darauf, über ihre Websites sehr interaktive und kanalübergreifende Nutzererlebnisse zu schaffen, was dazu führt, dass sie auf die entkoppelte Architektur von Drupal angewiesen sind. Eine solche Funktionalität der entkoppelten Architektur von Drupal bietet Unternehmen die Flexibilität, Innovationen zu entwickeln, unzählige Optionen für das zu schaffen, was sie erstellen möchten, und ermöglicht ihnen den Aufbau mehrerer Websites und Anwendungen. Darüber hinaus ermöglicht sie es dem Entwickler, mit Drupal in drei verschiedenen Modi zu arbeiten, z. B. mit einem vollständig entkoppelten Drupal-Ansatz, einem progressiv entkoppelten Drupal-Ansatz (Hybrid) und einem traditionellen Drupal. Heute werden wir also den vollständig entkoppelten Drupal-Ansatz diskutieren und Sie mit seinen Merkmalen und Funktionalitäten vertraut machen. 

Das Verständnis von Fully Decoupled Drupal und seinen Kategorien
 

Es gibt im Allgemeinen drei Ansätze für die Drupal-Architektur: traditionell (oder gekoppelt), progressiv entkoppelt und vollständig entkoppelt. Sie können hier mehr darüber lesen: Wie man Drupal entkoppelt und die verschiedenen Möglichkeiten, dies zu tun. Entsprechend den Bedürfnissen verschiedener Präferenzen und Anforderungen sind alle drei Ansätze auf ihre Weise wichtig. Werfen wir nun einen kurzen Blick auf die ersten beiden Ansätze und konzentrieren wir uns mehr auf den dritten Ansatz, d. h. Fully Decoupled Drupal, da dies das Hauptthema ist, in das wir heute eintauchen. 

Wenn es um traditionelles Drupal geht, bleiben alle allgemeinen Verantwortlichkeiten von Drupal intakt, da Drupal als monolithisches System betrachtet werden kann und darüber hinaus die volle Kontrolle über die Präsentations- und Datenebene effizient aufrechterhält. Traditionelles Drupal erweist sich als eine gute Wahl für Redakteure, die die vollständige Kontrolle über die visuellen Elemente auf der Seite benötigen und Zugriff auf Funktionen wie In-Place-Bearbeitung und Layout-Verwaltung haben.

Manchmal wird JavaScript benötigt, um ein hochinteraktives Endbenutzererlebnis zu bieten. In solchen Fällen wird ein entkoppelter Ansatz zur Notwendigkeit. Daher wird ein JavaScript-Framework auf das bestehende Drupal-Frontend in progressiv entkoppeltem Drupal aufgesetzt. Dieses JavaScript ist für das Rendern eines einzelnen Blocks oder einer Komponente auf einer Seite verantwortlich oder rendert sogar alles innerhalb des Seitentextes. Dieses Ansatzmuster liegt auf einem Spektrum, d. h. je weniger die Seite JavaScript gewidmet ist, desto besser können die Redakteure die Seite mit Hilfe der administrativen Fähigkeiten von Drupal steuern. 

Fully Decoupled Drupal beinhaltet eine vollständige Trennung der Zuständigkeiten zwischen der Präsentationsebene und allen anderen Aspekten des CMS. Bei diesem Ansatz wird das CMS zu einem Datenprovider, und eine JavaScript-Anwendung oder ein Static-Site-Generator kommuniziert mit Drupal über Webservice-APIs. Lesen Sie hier mehr über CMS und Anwendungsfälle von Static-Site-Generatoren. Trotz der Nichtverfügbarkeit wichtiger Funktionen wie In-Place-Bearbeitung und Layout-Verwaltung kann Fully Decoupled Drupal für Entwickler interessant sein, die eine größere Kontrolle über das Frontend suchen und bereits über Erfahrung im Erstellen von Anwendungen in Frameworks wie Angular, React, Gatsby usw. verfügen. 

Erfahren Sie hier mehr über Decoupled Drupal:

• Vollständiger Leitfaden zu Decoupled Drupal
• Vorteile von Decoupled Drupal
• Ist Decoupled Drupal die richtige Wahl für Sie?
• Wann sollte man von einer monolithischen zu einer entkoppelten Drupal-Architektur wechseln?
• Die besten Frontend-Technologien für Ihre Decoupled-Drupal-Projekte
• Die richtigen Fähigkeiten, die für die Implementierung einer entkoppelten Drupal-Architektur benötigt werden
• Rollen wichtiger Webservices wie REST, GraphQL und JSON:API und die alternativen Lösungen, die im entkoppelten Drupal-Ökosystem verfügbar sind
• Erfolgsgeschichten der Entkopplung von Drupal
• Die Zukunft der Entkopplung in Drupal: Die Decoupled-Menus-Initiative

Fully Decoupled Drupal kann auf zwei verschiedene Arten ausgeführt werden, nämlich Fully Decoupled App und Fully Decoupled Static Site. Wir werden uns nun die folgenden Möglichkeiten genauer ansehen. 

Fully Decoupled App

Vollständig entkoppelte Anwendungen werden in JavaScript geschrieben und verwenden Frameworks wie Angular, React, Vue.js während des Entkopplungsprozesses. 

                             

React

React ist eine JavaScript-Bibliothek, die 2013 gestartet wurde und zum Erstellen interaktiver Benutzeroberflächen (UIs) verwendet wird. Sie kann als eine der leistungsstärksten und am häufigsten verwendeten Frontend-Technologien angesehen werden, die vom Technologiekonzern Facebook verwaltet und unterstützt wird. React hat die Fähigkeit, die Codes in Komponenten aufzuteilen, um Entwicklern die Wiederverwendbarkeit von Code und das schnelle Debuggen zu ermöglichen. Aufgrund seines deklarativen Stils und des Fehlens von Annahmen über den Technologie-Stack hat es immense Popularität erlangt. In den letzten Jahren ist ein großes Ökosystem um React herum entstanden. Es umfasst auch hochwertige Bibliotheken, Konferenzen und eine wachsende Nachfrage nach Entwicklern mit React-Kenntnissen.

Einige der führenden Websites und Webanwendungen, die React als Frontend-Technologie verwenden, sind Facebook, BBC, Airbnb, Reddit und New York Times usw. 

React und Drupal

Wenn es um React und Drupal geht, spielt es keine Rolle, ob Sie einige der Elemente auf einer aktuellen Seite verbessern oder sogar eine vollständig entkoppelte Single-Page-App (SPA) erstellen, React und Drupal arbeiten in der Regel gut zusammen. Auch als Teil eines bestehenden Drupal-Themes wird React verwendet, um eine bessere Benutzererfahrung zu bieten. 

Mehr über die Kombination von Drupal und React finden Sie hier.

Angular

AngularJS ist ein schlankes und prägnantes Framework, das äußerst erweiterbar ist und es Ihnen ermöglicht, einige interessante Dinge mit Ihrer Website auszuprobieren. Es erweitert HTML, um Benutzeroberflächen zu definieren, sodass Sie interaktive Webanwendungen erstellen können, die hochfunktional und schwer zu knacken sind. Mit AngularJS können auch wiederverwendbare Komponenten erstellt werden, und aufgrund seiner clientseitigen Natur können alle Arten von Cyberangriffen gut verhindert werden. Es implementiert das MVC-Framework (Model-View-Controller), das einen schnelleren Entwicklungsprozess, mehrere Ansichten, eine asynchrone Technik, eine SEO-freundliche Entwicklung und viele weitere nützliche Funktionen ermöglicht. AngularJS verfügt über eine aufregende Funktionalität wie eine bidirektionale Datenbindung, die es Benutzeraktionen ermöglicht, Anwendungsobjekte sofort auszulösen und umgekehrt, und bietet auch ein äußerst interaktives Framework. 

Dieses Framework wird von einer großen Community gut unterstützt und vom Technologiekonzern Google verwaltet. Gmail, Paypal und The Guardian verwenden Angular als Frontend-Technologie.

Angular und Drupal

• Die starke Kombination von Drupal mit Angular ermöglicht es Ihnen, die Anzeigelogik auf die Clientseite zu verschieben und Ihr Backend zu optimieren, was zu einer schnellen Website führt.
• Aufgrund der Einfachheit und Klarheit in der Codestruktur bleibt HTML immer auf Abruf, und Angular verwendet HTML, um Benutzeroberflächen zu definieren, sodass Unternehmen interaktive Webanwendungen erstellen können, die hochfunktional sind. 

Mehr über die Kombination von Drupal und Angular finden Sie hier.

Vue

Vue.js ist ein JavaScript-Framework, das sehr beliebt für die Entwicklung interaktiver Anwendungen ist. Dieses Framework bietet datenreaktive Komponenten mit einer einfachen und flexiblen API. Darüber hinaus kann es als Bibliothek verwendet werden, um interaktive Elemente/Blöcke zu den bestehenden Websites hinzuzufügen. Mit Hilfe dieses außergewöhnlichen Frameworks können Sie die Benutzererfahrung deutlich verbessern. 

Vue und Drupal

• Die Kombination von Vue und Drupal ermöglicht es Entwicklern, Drupal-Inhalte einfach über das offizielle Vue-Resource-Plugin anzufordern und als Datenobjekte zu speichern.
• In Kombination mit Vue kann Drupal seine Magie im Backend zeigen, während die fesselnden Funktionen von Vue die Clientseite übernehmen. Auch das Komponentensystem von Vue ist eine der stärksten Funktionen, die den Aufbau großer Anwendungen ermöglicht, einschließlich kleiner und in sich geschlossener wiederverwendbarer Komponenten.

Mehr über die Kombination von Drupal und Vue finden Sie hier.

Fully Decoupled Static Site

Vollständig entkoppelte statische Websites tragen dazu bei, die Leistung und Sicherheit zu verbessern und die Komplexität für Entwickler zu reduzieren. Ein Static-Site-Generator wie Gatsby oder Metalsmith hilft beim Abrufen von Inhalten aus Drupal, beim Generieren einer statischen Website und beim Bereitstellen dieser statischen Website in einem CDN, in der Regel über einen bestimmten Cloud-Anbieter wie Netlify.

Gatsby

Gatsby ist ein Open-Source- und modernes Website-Framework, das die Leistung der Website verbessert, indem es die neuesten Webtechnologien wie React und GraphQL nutzt. Es wird zum Erstellen von blitzschnellen Anwendungen und Websites verwendet. Dieses Framework verwendet eine leistungsstarke Vorkonfiguration, um eine Website zu erstellen, die nur statische Dateien für unglaublich schnelle Seitenladezeiten, Service Worker, Code-Splitting usw. verwendet.

Gatsby und Drupal

• Die Verwendung von Drupal mit Gatsby kann eine großartige Möglichkeit sein, ein CMS in Unternehmensqualität kostenlos zu erstellen, gepaart mit einer großartigen modernen Entwicklungserfahrung. Es bietet alle Vorteile des JAMstack, wie Leistung, Skalierbarkeit und Sicherheit.
• Gatsby kann auch ein Feuerwerk abbrennen, indem es alle Seiten der Website vorab generiert, im Gegensatz zu dynamischen Websites, die Seiten bei Bedarf rendern, wodurch der Bedarf an Live-Datenbankabfragen reduziert wird. Folglich wird die Leistung verbessert und der Overhead sinkt, was zu geringeren Wartungskosten führt.

Mehr über die Kombination von Drupal und Gatsby finden Sie hier.

Metalsmith

Metalsmith ist ein einfacher, steckbarer Static-Site-Generator, der eine breite Palette von Vorlagen- und Datenformatoptionen unterstützt. Es bietet eine einfache Plug-in-Architektur und ist sehr einfach zu starten. Außerdem verwendet es eine modulare Struktur, und seine leichte Natur und geringeren Abhängigkeiten machen es zu einer ausgezeichneten Lösung. 

Metalsmith und Drupal

• Die Kombination von Metalsmith und Drupal kann aufgrund des großartigen Backends von Drupal, das verwendet werden kann, um Daten an alle Arten von Clients zu liefern, und der außergewöhnlichen Fähigkeiten von Metalsmith als Static-Site-Generator sehr vorteilhaft sein.
• Zusammen mit der großen Expertise von Drupal in der Content Governance erweist sich Metalsmith als eine ausgezeichnete Lösung für den Aufbau statischer Websites.

Mehr über die Kombination von Drupal und Metalsmith finden Sie hier.

Fazit

Ich möchte abschließend sagen, dass Sie mit Fully Decoupled Drupal schnelle und flexible Inhalte ohne eine bestimmte Bereitstellungsumgebung bereitstellen können. Sie können sogar die vollständige Kontrolle darüber haben, wie und wo Ihre Inhalte angezeigt werden. Ist das nicht großartig? Nun, ich bin mir ziemlich sicher, dass Ihnen dieser Artikel geholfen hat, sich mit dem sehr wichtigen Fully Decoupled Drupal-Ansatz vertraut zu machen. Ich hoffe, Sie können jetzt die richtige Entscheidung für Ihr Unternehmen in Bezug auf die Entkopplung von Drupal treffen.