WP React Starter

WP React Starter

Anwendungsfälle für WP React Starter

WP React Starter ermöglicht es dir, kostenlose, kostenpflichtige und Freemium WordPress-Plugins sowie wiederverwendbare JavaScript- und PHP-Pakete zu erstellen. Erfahre, was dies für deine Entwicklung und dein Geschäftsmodell anhand von devowl.io WordPress-Plugins bedeutet.

Screenshot für WP React Starter Instanz in Visual Studio Code
Verschiebe eine Seite für eine benutzerdefinierte Beitragsreihenfolge per Drag-and-drop

Kostenloses WordPress-Plugin

Real Custom Post Order ist ein kostenloses WordPress-Plugin, mit dem du eine benutzerdefinierte Reihenfolge der Benutzerdefinierte Reihenfolge für Beiträge, Seiten, WooCommerce-Produkte und benutzerdefinierte Beitragstypen in der WordPress Standardtabelle erstellen kannst. Es ist kostenlos auf wordpress.org verfügbar. Dieses Plugin verwendet das React-Frontend von WP React Starter, um per Drag & Drop das Verschieben von Content in der Tabelle zu ermöglichen. Die Reihenfolge der z.B. Beiträge wird in der Datenbank über einen REST-API-Endpunkt gespeichert, welcher im OOP-Stil im Backend des Plugins geschrieben ist.

WP React Starter stellt in diesem Fall nicht nur die Kernstruktur des Plugins, sondern auch den Veröffentlichungsprozess auf wordpress.org zur Verfügung. Beim Merge in den master Branch wird der Continuous Deployment Prozess angestoßen und das Plugin wird automatisch auf wordpress.org veröffentlicht.

Kostenpflichtiges WordPress-Plugin

Real Media Library startete als unser meistverkauftes kostenpflichtiges Plugin auf codecanyon.net. Es ist ein umfangreicheres Plugin, mit dem du Ordner, Sammlungen und Galerien in der WordPress Media Library erstellen kannst.

Das Plugin muss in der Lage sein, einen Baum von mehreren tausend Dateien aus der Medienbibliothek im Frontend zu halten. Die Vorteile der reaktiven Programmierung sind der Schlüssel zur Bereitstellung der Performance, die der Benutzer benötigt. Viele alternative Plugins leiden unter einer schlechten Performance bei vielen Dateien - wir nicht.

Die gesamte Kommunikation zwischen dem Frontend und der Datenbank wird über benutzerdefinierte REST-API-Endpunkte abgewickelt, die im OOP-Stil entwickelt wurden. Ein wartbarer Code ist für diese Plugins wichtig, da das Backend tief in die Funktionalität der WordPress Core-Medienbibliothek sowie in alle gängigen Page Builder integriert werden muss.

Darüber hinaus bietet uns WP React Starter den End-to-End-Prozess für die Erstellung, das Testen und die Veröffentlichung, den wir für die schnelle Veröffentlichung von Features und Bugfixes benötigen. Genau das, was unsere Kunden von einem kostenpflichtigen Plugin erwarten.

Real Media Library
Real Thumbnail Generator

Freemium WordPress-Plugin

2019 wollten wir eine kostenlose Version unseres WordPress-Plugins Real Thumbnail Generator erstellen, das bis dahin ein reines kostenpflichtiges Produkt war. Dieser Schritt sollte es uns ermöglichen, neue Kundensegmente zu erreichen, die das Plugin zunächst auf ihrer WordPress-Instanz ausprobieren und vielleicht später eine PRO-Version kaufen möchten. Aber das einfache Hinzufügen eines "if-else" zur Deaktivierung von Funktionen für Kunden der kostenlosen Version ist weder von wordpress.org noch von der GPL-Lizenz erlaubt. Du musst stattdessen PRO-Funktionen aus deinem Code für die kostenlose Version auf wordpress.org entfernen.

Die flexible Struktur von WP React Starter hat dazu beigetragen, Real Thumbnail Generator trotz dieser Anforderungen zu einem echten Freemium-Produkt zu machen. Wir haben einen benutzerdefinierten Autoloader für das PHP-Backend hinzugefügt und die Webpack-Konfiguration für das Frontend-JavaScript modifiziert, um Codeblöcke während der Build-Time zu entfernen. Das Ergebnis dieser Änderungen ist, dass wir eine Code-Basis mit zwei Build-Prozessen haben: PRO und FREE. Beide Builds haben unterschiedlichen Code, je nachdem, welche Funktionen du in die jeweilige Version aufnehmen möchtest.

Wiederverwendbare JavaScript- und PHP-Pakete

Wenn du mehrere WordPress-Plugins entwickelst, kann es sein, dass du immer wieder auf die gleichen Probleme stößt. In unserem Fall wollen wir die großartige Ant Design Library für moderne UI-Komponenten nutzen und gleichzeitig den Look and Feel der Komponenten an das WordPress (Backend)-Design anpassen. Wir haben die notwendigen Schritte implementiert, um dieses Ziel zu erreichen - in jedem Plugin erneut.

WP React Starter ermöglicht es Paketen für JavaScript und PHP zu erstellen. Dies sind nichts anderes als Pakete, die du von NPM oder Packagist konsumieren würdest, aber privat, direkt in deinem Monorepo und mit Hot Reloading. Wir waren in der Lage, Styles und Logik zu extrahieren, um Ant Design zu einem benutzerdefinierten Paket zu erweitern, das wir in allen unseren Plugins verwenden können. Das nächste Mal, wenn ein WordPress Core Update die Styles ändert, brauchen wir es nur einmal anzupassen, anstatt in jedem unserer Plugins.

Screenshot der Ant Design Website