Johannes Kinast
Startseite

Private GitHub npm Packages im GitHub Actions Workflow verwenden

Johannes

GitHub bietet mit GitHub Packages eine limitiert kostenfreie Alternative zu den sonst kostenpflichtigen privaten npm Packages an. Allerdings habe ich lange nach einem Weg suchen müssen, private GitHub Packages in GitHub Actions zu verwenden.

npm login kann man nicht so einfach ausführen, weil der Personal access token eingegeben werden muss und nicht über einen Parameter übergeben werden, kann und der secrets.GITHUB_TOKEN nicht ausreicht, um private GitHub Packages über npm install zu laden.

Meine Lösung für das Problem:

Weiterlesen „Private GitHub npm Packages im GitHub Actions Workflow verwenden“

Ist Tailwind CSS eine gute Idee für WordPress Themes & Plugins?

Johannes

Tailwind CSS hat sich in den letzten Jahren von einem belächelten CSS-Framework zu einem echten Schwergewicht entwickelt. Der Grund dafür ist einfach: Es nimmt euch komplett die Frage ab, wie ihr eure CSS-Klassen benennt: gar nicht!

Statt euch für jedes Element eures Designs eine oder mehrere Klassennamen auszudenken und die Klasse dann in eurem Stylesheet zu definieren, definiert ihr bei Tailwind den Style direkt über einfach zu merkende CSS-Klassen im HTML-Markup, z.B. block p-2 mx-3 mt-3 bg-gray-900 hover:bg-gray-700 text-white cursor-pointer. Aufgelöst sieht der genutzte Teil des Stylesheets wie folgt aus:

Weiterlesen „Ist Tailwind CSS eine gute Idee für WordPress Themes & Plugins?“

Laravel Tools für WordPress: Lokale Entwicklungsumgebung mit Valet

Johannes

Laravel ist ein PHP-Framework um komplexe Anwendungen zu erstellen und WordPress ein Content Management System um Inhalte zu verwalten und anzuzeigen. Zwar kann man in Laravel auch einen Blog wie bei WordPress umsetzen aber i.d.R. nutzt man Laravel eher für komplexere Anwendungen.

Um Laravel ist aber ein ganzes Ökosystem an nützlichen Tool entstanden, die man auch mit WordPress sehr gut nutzen kann. Meistens handelt es sich dabei um Tools für die Entwicklung z.B. von Plugin & Themes aber auch in anderen Bereichen lassen sie sich nutzen.

In dieser Serie möchte ich euch einige der Tools vorstellen. Den Anfang macht Laravel Valet:

Weiterlesen „Laravel Tools für WordPress: Lokale Entwicklungsumgebung mit Valet“

WordPress Snippet: Revisionen für Wiederverwendbare Blöcke aktivieren

Johannes

In meinen Augen sind die wiederverwendbaren Blöcke im WordPress Block Editor a.k.a. Gutenberg Gold wert. Ich nutze sie täglich. Allerdings wurde mit WordPress 5.7 die UI im Editor grundlegend geändert und sie integrieren sich fast nahtlos in den restlichen Content. Das für aber leider regelmäßig dazu, dass ein wiederverwendbarer Block von einem Autor unwissentlich bearbeitet wird. Eigentlich sollte das dank der Revisionen in WordPress kein Problem sein, leider sind sie aber für den wp_block Post Type, der für die wiederverwendbaren Blöcke verwendet wird, nicht aktiviert.

Weiterlesen „WordPress Snippet: Revisionen für Wiederverwendbare Blöcke aktivieren“

Laravel Tools für WordPress: Debuggen mit `dd` & `dump` statt `print_r`

Johannes

Das Diagnostizieren von Fehler beim Programmieren von WordPress Plugins & Themes in PHP sieht bei mir meistens wie folgt aus:

// ...
echo '<code>';
print_r($meine_variable_in_der_ich_einen_fehler_vermute);
echo '</code>';
exit;
// oder
echo '<pre>';
var_dump($meine_variable_in_der_ich_einen_fehler_vermute);
echo '</pre>';
die;
Code-Sprache: PHP (php)

Nicht besonders elegant, aber so sieht meistens die Praxis in PHP aus. Selbst in der offiziellen PHP Dokumentation gibt es keine sinnvollen Vorschläge, wie man in PHP sauber Fehler diagnostizieren kann.

Weiterlesen „Laravel Tools für WordPress: Debuggen mit `dd` & `dump` statt `print_r`“

Laravel Tools für WordPress: Webpack in elegant mit Laravel Mix 6

Johannes

In der kleinen Serie zu Laravel Tools für WordPress, habe ich euch bereits Laravel Valet für die lokale Entwicklungsumgebung vorgestellt. Heute geht es wieder um ein Tool, was euch bei der Entwicklung von Themes & Plugins helfen kann. Besonders, wenn ihr an Block Editor (Gutenberg) Blöcken schraubt.

Laravel Mix vereinfacht euch die Arbeit mit Webpack enorm und spätestens, wenn ihr euren ersten Block in JavaScript programmiert, kommt ihr nicht mehr an Webpack (oder einem anderen JavaScript-Modul-Packer) vorbei. Die Konfiguration von Webpack empfinde ich aber als sehr kompliziert. Vor allem, wenn man noch nie mit React gearbeitet hat. Laravel Mix nimmt euch die Konfiguration in 80% der Fälle ab und reduziert den Konfigurationsaufwand extrem.

Weiterlesen „Laravel Tools für WordPress: Webpack in elegant mit Laravel Mix 6“

Vue.js Components im WordPress Block Editor / Gutenberg anzeigen

Johannes

Gutenberg basiert ja (leider) auf React. Ich programmiere aber schon seit Jahren viel lieber mit Vue.js 2. Zwar habe ich mich damit abgefunden Blöcke für den Block Editor aka Gutenberg in React zu schreiben (wobei man nur sehr begrenzt eigentlich React verwendet, eher noch JSX), aber trotzdem verwende ich für einige Blöcke Vue.js. Im Fronend kein Problem, aber eine Vorschau im Block Editor angezeigt zu bekommen, inkl. Änderungen an den Attributen, war eine echte Herausforderung.

Weiterlesen „Vue.js Components im WordPress Block Editor / Gutenberg anzeigen“

WordPress 5.6: Standard für die Verlinkung von Bildern setzen

Johannes

Mit WordPress 5.6 wird endlich wieder die Option image_default_link_type im Block Editor/Gutenberg berücksichtigt. Für ihr oder ein anderer Nutzer eurer Website einen neuen Bild- oder Gallerie Block ein, werden die Bilder dann standardmäßig auf die Mediendatei, Anhangsseite oder (bisher der Standard) gar nicht verlinkt.

Weiterlesen „WordPress 5.6: Standard für die Verlinkung von Bildern setzen“