Mein erstes WordPress Plugin

Am vergangenen Freitag habe ich mein erstes WordPress (WP) Plugin veröffentlicht. Es ist ein Plugin, dass es den vielen Webmastern an der FAU erlaubt Ihre Webseiten-Statistiken auf dem eigenen WP-Dashboard anzuschauen und zu exportieren.

Dazu muss man wissen, dass diese Daten auf einem separaten Server bereitgestellt werden. RRZE Statistik, so heißt das kleine, interne Plugin liefert also ein paar schicke Diagramme und CSV Rohdaten, um den Überblick über Besucherzahlen und die eigenen Webstatistiken zu erleichtern.

Dieses Projekt war für mich das erste Projekt, bei dem ich JavaScript in der freien Praxis anwenden konnte. Zwar kannte ich bereits die Theorie dahinter und hatte auch viel Übung, wie man in JavaScript programmieren kann, was auch dem tollen JavaScript Kurs von Jad Joubran geschuldet ist, allerdings hatte ich bis dahin noch nie ein richtiges Projekt, bei dem man aus PHP Daten an JavaScript übergeben musste.

Das Plugin speichert die Datensätze über einen Cronjob in der WordPress Datenbank. Wenn jetzt ein Nutzer sein Dashboard aufruft, werden diese Datensätze, falls Sie vorhanden sind, als Variablen an den JavaScript-File übergeben. Dort werden Sie mit vanilla JavaScript ins richtige Format gebracht, bevor Highcharts.js aus den Datensätzen eine bunte Ausgabe (inklusive Exportfunktion) bastelt.

Daten visuell darstellen

Bei meiner Recherche bin ich neben Highcharts auch auf D3.js gestoßen. Tastächlich hat es mich so fasziniert, dass ich mich direkt für einen D3-Kurs angemeldet habe. D3.js ist quasi der JavaScript Baukasten für Datenvisualisierung. Zwar bietet auch Highcharts viele Diagrammtypen an, allerdings reizt es mich, in Zukunft einmal eine eigene interaktive Grafik zu basteln. Immerhin leben wir in einer Zeit, wo es eine scheinbar unendliche Zahl an neuen Erkenntnissen und Daten gibt und im Vergleich dazu, wenig Menschen, die versuchen, das ganze in eine visuelle, verständliche Form zu pressen. Vielleicht poste ich also auch in Zukunft einmal das ein oder andere interaktive Diagramm auf meiner Seite. (Falls ich bis dahin die D3.js Library etwas besser verstanden habe).

Erster Kontakt mit Webpack

Neben JavaScript (Highcharts und D3.js) habe ich gleichzeitig auch unter Anleitung von einem meiner Kollegen auch das erste mal Webpack verwendet. Ich muss sagen, dass Webpack zumindest für mich als Einsteiger wirklich nicht trivial ist. Selbst nach einem etwas längeren Tutorial dazu habe ich noch nicht komplett verstanden, wie man in der Webpack-Konfigurationsdatei neue Module oder Plugins richtig verknüpft.

Wenn man allerdings einmal eine funktionierende Webpack Konfiguration erstellt hat, erleichtert es die Arbeit ungemein. Webpack verpackt dann z.B. einfach die Sass-Files und JavaScript files und quetscht alles in ein komprimiertes, kleines Paket, dass der Browser natürlich weiterhin auslesen kann.

L10n – Eine Hassliebe

Localization, wie es in der WordPress Dokumentation so schön genannt wird, hat mir bei meinem Projekt gegen Ende einigen Frust bereitet. Vermutlich habe ich mir das auch selbst zuzuschreiben, da ich durch die vorangegangene Webpack-Konfiguration gleichzeitig wohl auch Probleme mit den zuständigen Funktionen, die die übersezten JavaScript-Strings bereitstellen, verursacht habe.

Bis jetzt bin ich noch nicht ganz dahinter gekommen, welche Webpack-Module ich verwenden muss, damit WordPress am Ende meine Strings noch in der JavaScript-Datei erkennt. Allerdings ist das wohl nur eine Frage der Zeit.

Mein persönlicher Workaround war, die Strings in einem PHP File zu übersetzen und den Inhalt als gebündeltes Array an den zuständigen JavaScript-File zu übergeben.

Zwar nicht ideal, aber ein Workaround, bis ich das Problem mit meiner Webpack-Konfiguration gelöst habe.

Cronjobs, Transients & Co.

Bevor ich den heutigen Blogpost beende. Es lohnt sich wirklich das WordPress Plugin Entwickler Handbuch zu lesen 😉. Die ein oder andere Passage zu Transients, Cronjobs und Co. haben mir etliches an Zeit gespart und ich denke, dass die vielen Schreiber wirklich einen guten Job gemacht haben, das ein oder andere schwere Thema halbwegs verständlich darzustellen.

Am Anfang war ich kein Fan des Handbuchs. Inzwischen ist es wie eine kleine Fibel, die man bei Fragen als Nachschlagwerk verwendet.

(Neben Stackoverflow und Stackexchange).

PS: Man ist anfangs ganz schön nervös, wenn man sein erstes Plugin an einem Freitag auf einen Live-Server loslässt. Noch nervöser werde ich aber erst am 1. April, wenn sich offenbaren wird, ob das Plugin auch den Monatswechsel richtig verarbeitet. Aber das ist dann ein Problem für mein Zukunfts-Ich. Hoffentlich wurde der Code gut dokumentiert.