10+ hilfreiche Javascript-Tutorials für WordPress-Entwickler im Jahr 2017

In Matt Mullenwegs 2015 State of the Word-Ansprache gab er der gesamten WordPress-Community eine Hausaufgabe – „Learn JavaScript, Deeply“. Dieser Fokus, zusammen mit Entwicklungen wie Calypso und der REST-API, ist der Grund, warum wir gerade einen grundlegenden JavaScript-Tutorial-Beitrag für Anfänger veröffentlicht haben, um mit JavaScript zu beginnen.

Dieser Beitrag konzentriert sich jedoch ausschließlich auf grundlegende JavaScript-Tutorials. In diesem Beitrag gehe ich etwas weiter und gebe Ihnen eine JavaScript-Tutorial-Liste mit Inhalten, die sich speziell auf JavaScript in Bezug auf WordPress konzentriert .

Da der Schwerpunkt auf angewandtem JavaScript und nicht auf den Grundlagen liegt, benötigen Sie wahrscheinlich mindestens ein grundlegendes Verständnis von JavaScript, um von diesen Tutorials profitieren zu können. Wenn das nach Ihnen klingt, lade ich Sie ein, sich einzugraben und etwas WordPress-anwendbares JavaScript zu lernen!

Hilfreiche JavaScript-Tutorials für WordPress-Entwickler

Bevor ich zu der Liste der Tutorials komme, möchte ich eine Sekunde damit verbringen, einige Hintergrundinformationen darüber zu geben, wie ich diese Liste tatsächlich erstellt habe.

Wie ich in der Einleitung erwähnt habe, ist dies keine Liste allgemeiner Tutorials, die Ihnen beim Erlernen von JavaScript helfen. Um es auf diese Liste zu schaffen, suchte ich vielmehr nach zwei Dingen:

• Die Ressource befasst sich speziell mit der Anwendung von JavaScript auf WordPress
• Der Inhalt umfasst etwas „Fleisches“. Das heißt, es ist mehr als nur ein kurzer Codeausschnitt oder eine kurze Erklärung.

Über diese beiden Anforderungen hinaus decken die Tutorials auf dieser Liste ein ziemlich vielseitiges Anwendungsspektrum ab. Darüber hinaus handelt es sich bei den meisten um eigenständige Tutorials, bei einigen handelt es sich jedoch um umfassendere Kurse oder Sammlungen.

Und schließlich sind die meisten Tutorials kostenlos, aber es gibt auch einige kostenpflichtige Optionen in der Liste. Ich werde darauf achten, zu notieren, welches was ist, damit Sie etwas finden können, das Ihrem Budget (oder dessen Fehlen) entspricht.

Ok – genug gequatscht. Kommen wir zur Liste…

1. Verwenden Sie AngularJS als WordPress-Frontend

In diesem Tutorial von Andrea Terzani führt er Sie durch den Aufbau einer einfachen AngularJS-Anwendung zum Bereitstellen von Post-Inhalten. Andrea ist Italiener, daher ist die Grammatik nicht immer perfekt ( das ist keine Kritik, ich schätze Zweisprachigkeit!)

Preis: Kostenlos | Mehr Informationen

2. JavaScript für WordPress

Zac Gordon ist in der WordPress-Community dank seiner Treehouse-Tutorials sowie seiner Vorträge bei einer Vielzahl von WordCamp-Events ziemlich bekannt.

JavaScript für WordPress ist sein „Master-Kurs“-Programm zum Erlernen von JavaScript, wie es für WordPress gilt.

Der Kurs ist weder öffentlich zugänglich noch kostenlos. Tatsächlich müssen Sie einen Sitzplatz reservieren, bevor Sie überhaupt in den Kurs einsteigen können.

Das liegt daran, dass Zac es vorzieht, entweder einzeln oder in kleinen Kohorten zu arbeiten, anstatt einen mehr „einstellen und vergessen“-Ansatz beim Lernen zu verfolgen.

Diese persönliche Aufmerksamkeit ist nicht billig – der Kurs kostet coole 697 US-Dollar. Aber wenn Sie es ernst meinen mit dem Erlernen von JavaScript für die WordPress-Entwicklung, die Anmeldeinformationen von Zac untermauern definitiv den hohen Preis.

Preis: $697 | Mehr Informationen

3. Reaktive WordPress-Plugins erstellen

Delicious Brains, die Macher des von Entwicklern beliebten WP Migrate DB-Plugins, haben auf ihrem WordPress-Blog jede Menge hochwertige, entwicklerorientierte Tutorials veröffentlicht. Diese dreiteilige Serie zum Erstellen reaktiver WordPress-Plugins ist keine Ausnahme.

Jeder der drei Beiträge in der Serie konzentriert sich darauf, dasselbe einfache WordPress-Plugin zu erstellen, nur mit einer anderen Front-End-Technologie.

In der gesamten Serie können Sie sehen, wie das Plugin aufgebaut ist mit:

• Backbone.js
• Vue.js
• Ulme

Die Tutorials sind langwierig und gut erklärt, sodass Sie mit dieser Serie auf jeden Fall eine Menge Wert bekommen.

Preis: Kostenlos | Mehr Informationen

4. Verwenden von Backbone im WordPress-Admin

In diesem zweiteiligen Tutorial von Envato Tuts+ erfahren Sie zuerst, wie Sie Backbone JS im WordPress-Backend anwenden, gefolgt vom zweiten Teil über die Verwendung von Backbone auf dem Frontend.

Shane Osbourne führt Sie durch alles, einschließlich zahlreicher Codebeispiele und Screenshots.

Wie es üblich ist, können Sie auch im Kommentarbereich nach einigen Diskussionen über die Codequalität suchen.

Preis: Kostenlos | Mehr Informationen

5. Yoren Changs Tutorials zum Erstellen von Themes mit AngularJS und WP REST API

Seit Oktober 2014 baut Yoren Changs Hobby WordPress-Themes mit AngularJS. Warum ist das wichtig für Sie? Denn während dieser Zeit hat er sein Hobby auch in einer Reihe von Tutorial-Posts auf seiner Website dokumentiert.

Derzeit hat er 21 verschiedene Tutorials veröffentlicht, die alle der Verwendung von AngularJS mit WordPress-Themes gewidmet sind.

Einige der Tutorials sind kurze Schnellstarter, während andere etwas tiefer gehen. Wenn Sie sie jedoch alle zusammenfassen, haben Sie eine tiefe Sammlung, die Sie für einige Zeit beschäftigt.

Preis: Kostenlos | Mehr Informationen

6. Arbeiten mit JavaScript und WordPress

Arbeiten mit JavaScript und WordPress ist ein kurzer PluralSight-Kurs des Entwicklers Brian Hogg.

Mit weniger als 2 Stunden ist der Kurs keine allzu große Verpflichtung. Es führt Sie durch eine kurze Einführung, wie Sie JavaScript in Plugins und Themes verwenden und AJAX zum Senden und Speichern von Daten verwenden.

Während Sie technisch gesehen eine PluralSight-Mitgliedschaft benötigen, um auf den Kurs zuzugreifen, können Sie eine kostenlose 10-Tage-Testversion von PluralSight erhalten, die Ihnen mehr als genug Zeit geben sollte, um den Kurs zu nutzen.

Preis : Kostenlos mit kostenloser Testversion | Mehr Informationen

7. Erstellen von Single Page Applications mit WordPress und Angular.js

Dieses JavaScript-Tutorial ist eine neuere Ergänzung von Tom Whitbread bei Envato Tuts+. Wie Sie wahrscheinlich aus dem Namen entnehmen können, werden Sie durch den Prozess der Verwendung von AngularJS geführt, um eine auf WordPress basierende Einzelseitenanwendung zu erstellen.

Sie können auch den gesamten Code von Tom auf seiner GitHub-Seite finden.

Preis: Kostenlos | Mehr Informationen

8. So erstellen Sie React-Apps auf der WordPress REST API

Dies ist ein weiterer, bei dem Sie eine ziemlich gute Vorstellung davon bekommen, was nur aus dem Titel abgedeckt wird!

Abgesehen von der Tiefe, auf die Andrey, der Autor, eingegangen ist, gefällt mir auch, dass dieses Tutorial einen soliden Kommentarbereich für zusätzliche Debatten enthält.

Sie können sich auch eine Demo des grundlegenden Front-Ends ansehen, das Sie erstellen werden, sowie die GitHub-Seite von Andrey mit dem gesamten Code.

Preis: Kostenlos | Mehr Informationen

9. Ein einfacher Weg zum Schreiben einer React.js-App in einem WordPress-Plugin

WPShout ist in der Community für seine entwicklerorientierten WordPress-Tutorials bekannt. Obwohl sie sich keineswegs ausschließlich auf JavaScript konzentrieren, befasst sich dieses Tutorial von Fred mit einem ähnlichen Thema wie das vorherige Tutorial, indem es Ihnen zeigt, wie Sie eine React.js-App in einem WordPress-Plugin schreiben.

Neben den Codebeispielen im Beitrag enthält Fred auch eine ZIP-Datei mit dem vollständigen Code aus der Demo.

Preis: Kostenlos | Mehr Informationen

10. JavaScript für WordPress-Entwickler von WPMUDev

Daniel Pataki, WordPress-Redakteur beim Smashing Magazine und ehemaliger Autor bei Elegant Themes, hat bei WPMUDev eine mehrteilige JavaScript for WordPress Developers-Reihe zusammengestellt.

Der Kurs baut von den Grundlagen bis hin zu weiterführenden Themen auf. Es ist etwas freundlicher für JavaScript-Anfänger als einige der fortgeschritteneren Tutorials auf dieser Liste. Wenn Sie sich also bisher ein wenig verloren gefühlt haben, ist dies vielleicht ein guter Anfang.

Preis: Kostenlos | Mehr Informationen

11. Single Page Apps mit AngularJS und der WordPress REST API

Dies ist ein detailliertes Tutorial von Almir bei SitePoint. Es gibt Ihnen einen detaillierten Einblick in die Verwendung von AngularJS zum Erstellen einer Single-Page-App basierend auf WordPress und der REST-API.

Almir enthält separate GitHub-Seiten sowohl für die Angular-App als auch für das WordPress-Child-Theme, das er im Beispiel verwendet, sodass Sie alles, was passiert, leicht mitverfolgen können.

Preis: Kostenlos | Mehr Informationen

Dinge zusammenfassen

Mit der zunehmenden Fokussierung auf die REST-API werden JavaScript und WordPress immer näher zusammenrücken. Ab März 2017 finden Sie sogar JavaScript-basierte Themes im WordPress.org-Repository.

Wenn Sie also mit der WordPress-Community Schritt halten möchten, müssen Sie, wie Matt es ausdrückte, „JavaScript tief lernen“.

Ich hoffe, mindestens ein JavaScript-Tutorial auf dieser Liste hat geholfen. Und wenn Sie ein großartiges Tutorial kennen, das es verdient, auf dieser Liste zu stehen, wäre es großartig, wenn Sie es in den Kommentaren teilen könnten, damit wir diese Ressource gemeinsam noch besser machen können.

Miniaturansicht des Artikels von Teguh Jati Prasetyo / shutterstock.com