In diesem Beitrag werden wir die Besonderheiten des Erstellens eines WordPress-Themes mit React betrachten. Wir zeigen euch auch, welchen Wert die Entwicklung von WordPress React-Themes haben kann.
Content ist von größter Bedeutung, das weiß jeder, der eine Webseite hat. Es reicht jedoch nicht aus, nur Inhalte zu erstellen. Man muss sie auch effizient bearbeiten können.
Zu Beginn des Internet-Zeitalters war die Arbeit mit Inhalten für normale Benutzer kaum relevant. Alles änderte sich jedoch, als die ersten Content Management Systeme (CMS) ins Spiel kamen. Sie ermöglichten „bloßen Sterblichen“ ohne vorherige Erfahrung durch digitale Technologien grundlegende Aktivitäten mit Website-Inhalten einfach und schnell durchzuführen.
Von diesen ist WordPress eine der ältesten und beliebtesten Plattformen. Millionen von Websites aller Art, von Blogs bis zu Online-Shops, basieren auf WordPress. Was dieses CMS in erster Linie so attraktiv macht, ist das praktische, intuitive Admin-Panel. Administratoren können damit mühelos sowohl die Back-End- als auch die Front-End-Aufgaben erledigen.
Vor einigen Jahren kam es zu einer monumentalen Veränderung in der WordPress-Landschaft. Die REST-API wurde dem Kern des Systems hinzugefügt. Jetzt haben die WordPress-Entwicklungsteams die Möglichkeit, mit anderen Technologien als PHP und HTML zu arbeiten, um benutzerdefinierte WordPress-Themes zu erstellen.
Das WordPress-Frontend wurde vom WordPress-Backend entkoppelt, kann unabhängig entwickelt und sogar von einem anderen Server ausgeführt werden. Dies hat eine Vielzahl von Möglichkeiten geschaffen. Entwickler haben damit begonnen, verschiedene JavaScript-Frameworks zu verwenden, um benutzerdefinierte WordPress-Designs zu erstellen oder vorhandene zu verbessern, während sie sich weiterhin auf WordPress stützen, um Daten abzurufen und an die Datenbank zu senden.
Eine der beliebtesten ist React.js, eine JS-Bibliothek, die 2013 von Facebook veröffentlicht wurde. Schauen wir uns mal genauer an, woran das liegt.
Wenn wir über die
React Entwicklung eines WordPress-Themes sprechen, müssen wir unbedingt das Eckpfeilerkonzept erklären, das dies alles ermöglicht - die REST-API. In früheren Versionen von WordPress wurde die REST-API als Plug-In implementiert. Jetzt wurde es dem Kern des Systems hinzugefügt. Dies ist eine der revolutionärsten Verbesserungen, die WordPress jemals erlebt hat.
Eine API ist eine Anwendungsprogrammierschnittstelle. REST bedeutet wiederum die Übertragung des Repräsentationsstatus und ist im Wesentlichen eine Reihe von Regeln, die festlegen, wie Website-Daten in Form von Sammlungen und Objekten bearbeitet (erstellt, gelesen, aktualisiert und gelöscht) werden sollen.
Jeder WordPress-Datentyp wird durch den sogenannten Endpunkt oder die URL dieses bestimmten Typs dargestellt. Beispielsweise lautet die Basisroute von Posts / wp / v2 / posts, während die Basisroute von Themes / wp / v2 / theme ist. Wenn man ein WordPress-Design mit React oder einem ähnlichen JS-Framework erstellt, kann man diese Endpunkte im Code verwenden, um Daten in der Datenbank zu bearbeiten.
Die Daten selbst werden als JSON-Objekte zwischen dem Back-End und dem Front-End übertragen. JSON steht für JavaScript Object Notation. Dabei handelt es sich um ein praktisches Dokumentformat, das JavaScript-Objekte mit Schlüssel-Wert-Paaren enthält. Werte können als andere JS-Objekte oder Arrays von Objekten dargestellt werden. Hier ein Beispiel:
Man muss sich das wie eine Fernbedienung für den Fernseher vorstellen. Man drückt den Einschalttaste. Das Signal zum Einschalten wird an das Fernsehgerät gesendet, und man erhält Informationen. Wir können sagen, dass ein Endpunkt der Knopf und das entsprechende JSON-Objekt das Signal ist.
Wir haben keine Ahnung, wie dieses Signal im Fernsehgerät verarbeitet wird. Alles, was uns interessiert, sind die Informationen. Die Fernbedienung ist die Schnittstelle, über die man durch Drücken verschiedener Tasten mit dem Fernsehgerät kommunizieren kann.
Die REST-API dient als Schnittstelle, über die man eine Verbindung zur Datenbank herstellen und Operationen an den Daten ausführen kann. Zwei Dinge sind zu beachten:
• Die REST-API unterliegt denselben Sicherheitsbeschränkungen, unabhängig davon, ob ein WordPress-Theme mit React.js (einem ähnlichen JS-Framework) erstellt oder das alte, zuverlässige PHP verwendet wurde.
• Die Verwendung der WordPress REST-API ist keinesfalls obligatorisch.
Wir haben bereits ein paar Vorteile angesprochen, die die REST-API für WordPress-Site-Besitzer bringt: Das Front-End und das Back-End sind jetzt klar voneinander getrennt. Wir können zwei verschiedene Entwicklungsteams haben, die von verschiedenen Standorten aus arbeiten und die jeweiligen Teile der Seite von verschiedenen Servern aus ausführen.
Hier sind noch ein paar weitere Vorteile:
• Wenn eine React-App als WordPress-Design erstellt wird, erhalten wir eine Single Page Application (SPA) mit einem einzigartigen Design und einem hervorragenden Benutzererlebnis.
• Ein WordPress React.js-Theme ist hochdynamisch / interaktiv, leistungsfähig und kann Animationen integrieren. Andere Frameworks ermöglichen es Entwicklern, Animationen auch in Themes zu verwenden, aber React.js macht diesen Prozess etwas einfacher.
• Ein React-Theme für WordPress kann Daten auf der Clientseite speichern, um die Geschwindigkeit zu erhöhen.
Diese Argumente sollten stark genug sein, um euch davon zu überzeugen, die REST-API in euren nächsten oder aktuellen Projekt zu nutzen. Warum solltet ihr jedoch ein WordPress-Theme mit React erstellen, wenn man auch andere Technologien verwenden könnte? Hier ist die Antwort.
DIE REACT-WORDPRESS-THEMEENTWICKLUNG: DIE BESTE OPTION FÜR EURE WEBSITE
Wir haben bereits in einem unserer vorherigen Beiträge die Hauptstärken von React hervorgehoben. Hier sind die wichtigsten Punkte, die React zu einer großartigen Bibliothek zum Erstellen von WordPress-Themen macht.
DIE ENTWICKLUNG VON WORDPRESS-THEMES MIT REACT IST SCHNELL UND EINFACH
WordPress-Entwickler schätzen diese Funktion von React sehr. Wenn man sich die Syntax JSX ansehen, sieht sie aus wie JavaScript-Code mit HTML. Darüber hinaus ist alles in React eine Komponente, die die Logik, Struktur und visuelle Darstellung an einem Ort vereint.
Während dies gegen das Prinzip der Trennung von Bedenken verstößt, setzen sich Entwickler schnell mit diesem Konzept auseinander und finden es praktisch.
Jeder, der mit JavaScript und HTML vertraut ist, kann die Grundlagen von React ziemlich schnell verstehen, obwohl es eine Weile dauern kann, bis man einige fortgeschrittene Dinge beherrscht. Die einfache Syntax und die vertrauten Technologien machen die Entwicklung von React WordPress-Designs sehr schnell (auch hier kann die Bearbeitung einiger Aufgaben wie das Implementieren des serverseitigen Renderns länger dauern). Dies trägt zu geringeren Entwicklungskosten bei.
MAN KANN VIELE VERFÜGBARE KOMPONENTEN VERWENDEN
Eine weitere großartige Sache, die die Entwicklung von React WordPress-Designs beschleunigt, ist die Möglichkeit, viele Komponenten aus einem Projekt in einem anderen zu verwenden. Genau wie bei Lego-Bausteinen können WordPress-Entwickler einen „Würfel“ nehmen und in eine andere Site einfügen.
Natürlich kann es bestimmte Funktionen geben, die sich nur schwer problemlos auf ein anderes Projekt übertragen lassen. Bei einfachen Komponenten ist dies jedoch durchaus möglich. Das Beste daran: Alle diese Bausteine sind nicht miteinander verbunden und können daher verändert werden, ohne befürchten zu müssen, dass etwas in den anderen kaputt geht.
EINIGE NEGATIVE ASPEKTE, DIE ZU BEACHTEN SIND
REACT.JS IST NOCH IN DER ENTWICKLUNG
So schnell und effizient React auch ist, es ist ein relativ neues Tool. Die Erstveröffentlichung fand erst vor 7 Jahren statt. Das bedeutet, dass sich die Plattform noch in der aktiven Entwicklungsphase befindet. Probleme und Fehler sind nicht selten.
Mit jeder neuen Version wird React jedoch ausgereifter und robuster. Die React-Entwicklergemeinschaft ist bereits ziemlich umfangreich. Dies bedeutet, dass Entwickler von WordPress Theme React leicht Lösungen für eure Probleme finden sollten.
Die Implementierung der Wordpress REST-API mit React kann einige zusätzliche Anstrengungen erfordern.
Nur weil ihr React.js mit Wordpress über die REST-API verbunden habt, heißt das nicht, dass eure Website schneller funktioniert. Das liegt daran, dass die React-App immer noch viele Daten aus der Datenbank abrufen muss, insbesondere wenn die Benutzeroberfläche sehr komplex ist.
Um mit React ein wirklich schnelles WordPress-Theme erstellen zu können, müssen Entwickler daher noch einen Schritt weiter gehen. Beispielsweise muss man möglicherweise einen Indexer erstellen, um ein einzelnes Dokument mit vielen häufig verwendeten Daten aus der Datenbank zu füllen. Es gibt noch weitere Problemlösungen, um die Kombination aus React und WordPress effizienter zu gestalten.