JavaScript-Bibliotheken und WordPress: Was Sie wissen müssen

Ich habe es schon einmal gesagt und ich sage es noch einmal: Wenn Sie ein WordPress-Benutzer sind, müssen Sie sich mit JavaScript vertraut machen. Das ist einfach der Weg des Webs. Das eigentliche Problem ist dann die beunruhigende Anzahl von JavaScript-Bibliotheken, die Sie durchsuchen müssen.

Es gibt Ember, React, Angular. Vue und Preact. Und vergessen Sie nicht Ionic, Express oder Node. Auch jQuery, Meteor und Bootstrap verdienen eine Erwähnung. Ach und was ist mit…

Du verstehst meinen Punkt. (Und das sind nur die, die ich spontan benennen könnte, ohne einen neuen Tab zu öffnen.) JavaScript-Bibliotheken machen die Landschaft übersät, weil sie für die Entwicklung ziemlich wichtig sind.

Egal, ob Sie DOM-Manipulation, ein MVC-Framework, AJAX-Aufrufe oder etwas ganz anderes wünschen, es gibt wahrscheinlich eine Bibliothek, aus der Sie auf Ihrem Weg ziehen können.

Als WordPress-Benutzer sollte das Musik in Ihren Ohren sein, und hier ist der Grund.

Was sind eigentlich JavaScript-Bibliotheken?

Einfach: ein Haufen vorgefertigter Code. Nichts Besonderes. Sie können jedoch eine Menge ausgefallener Sachen mit ihnen machen. Deshalb sind sie großartig.

Indem Sie vorgefertigten Code verwenden und ihn in Ihre Website einbinden, können Sie Funktionen hinzufügen, die Ihnen Zeit sparen, aber wahrscheinlich auch Lücken in Ihrem Fachwissen schließen. Sicher, du bist gut in dem, was du tust, aber du bist ein WordPress-Entwickler – kein JavaScript-Entwickler.

Das ist okay.

Wenn Sie JavaScript-Bibliotheken mit WordPress verwenden, nutzen Sie das Fachwissen anderer Personen, um Ihre Website und die Erfahrungen Ihrer Benutzer zu verbessern.

Das wichtigste zuerst

Als WordPress-Benutzer haben Sie bereits in Core Zugriff auf eine Reihe von JavaScript-Bibliotheken und deren Abhängigkeiten. Sehen Sie sich den Codex an, um eine vollständige Liste zu erhalten und zu erfahren, wie Sie wp_enqueue_script mit integriertem und externem JS verwenden.

JavaScript-Bibliotheken… Wofür sind sie gut?

Viele Leute sind verwirrt, wenn sie über JavaScript-Bibliotheken sprechen, weil sie oft fälschlicherweise als JavaScript-Frameworks bezeichnet werden , die anders sind. Ein Framework ist eine Art Bibliothek, funktioniert aber etwas anders als die meisten anderen.

Frameworks sind das, was Sie verwenden, um eine vollständige Anwendung oder Website zu erstellen. Im Wesentlichen erfüllen die JS-Frameworks die gleiche Funktion wie WordPress selbst – sie bilden das Rückgrat für jedes Projekt, an dem Sie arbeiten. Sie sind in Bezug auf die Verwendung viel strukturierter als Nicht-Framework-Bibliotheken.

Frameworks können in einige Kategorien unterteilt werden: Front-End-Frameworks, Back-End-Frameworks und Full-Stack-Frameworks. Wenn Sie mit den Begriffen nicht vertraut sind: Front-End ist das, womit der Benutzer interagiert, Back-End befasst sich mit serverseitigen Problemen und Full-Stack behandelt sowohl das Front- als auch das Back-End .

Sie haben wahrscheinlich schon von einigen der gebräuchlichsten/beliebtesten Frameworks gehört:

• Eckig
• Node.js
• Vue.js
• Reagieren
• Glut

Wie spielt sich das alles in WordPress ab?

Einige dieser Bibliotheken tun dies nicht. Das ist der springende Punkt, den ich ansprechen möchte: Sie brauchen kein Back-End-Framework (und in diesem Sinne ein Full-Stack-Framework), wenn Sie mit WordPress arbeiten. Unser entzückender Core übernimmt bereits diese Strukturebene für uns. (Beachten Sie, dass ein strittiger Punkt ist , wenn Sie ein Entwickler sind, der specifcally Core trägt und / oder tun eine Menge Anpassung auf eigene Faust.)

Was Sie lernen müssen (oder zumindest verstehen), sind die Front-End-Frameworks und DOM-Manipulationsbibliotheken. Diese kommen weitaus häufiger zum Einsatz als jede andere Art von JavaScript-Bibliotheken.

PHP ist eine großartige Sprache. Es gab uns WP, wie wir es heute kennen, und es funktioniert wirklich gut, alle Arten von Logik und Funktionalität in die Hände der Benutzer zu legen. Aber JavaScript-Bibliotheken nehmen die Macht und steigern sie exponentiell.

Bestimmte Plugins wie NinjaForms verwenden, obwohl sie in PHP geschrieben sind – weil WordPress dies sagt – JavaScript-Bibliotheken, um dem Benutzer eine bessere Erfahrung und weit mehr Funktionalität als sonst möglich zu bieten. WPNinjas hat dafür die Backbone- und Marionette-Bibliotheken verwendet.

Verdammt, sogar hier bei Elegant Themes ist Divi 3.0 (was großartig ist und Sie sollten sich auf all Ihren Websites anmelden) in React geschrieben.

Ebenso der kommende Gutenberg-Editor (zumindest für den Moment) und das WordPress.com-Admin-Panel namens Calypso (sowie Jetpack.) Verdammt, so ziemlich alles, was Sie im .org-Dashboard tun, wird von JavaScript unterstützt, bis sich etwas ändert auf dem Server und muss gespeichert werden.

Aber auch das könnte sich bald ändern…dank der WP REST API.

WP REST API + JavaScript-Bibliotheken = BFF

Sie haben wahrscheinlich schon von der WP REST API gehört. Kurz gesagt, es haucht der WordPress-JavaScript-Entwicklung eine Menge Leben ein, da Sie keine Serveranfragen über JavaScript stellen müssen, anstatt sich auf PHP zu verlassen.

Ja, Sie können jetzt direkt von vorne auf das Backend Ihrer Site zugreifen, ohne sich durch PHP quälen zu müssen, was die Reaktionszeit verlangsamt und die Funktionalität einschränkt. WPMU hat eine Aufschlüsselung der Verwendung der REST-API, die Sie sich auch ansehen sollten.

Sie können mit JS und REST so viel machen, dass es fast schon beängstigend ist, darüber nachzudenken. Wenn Sie React (und insbesondere React Native) verwenden, können Sie die WordPress-Datenbank als Back-End für Ihre mobile App verwenden, ohne jemals PHP zu berühren. Sie können über JSON über die REST-API direkt mit MySQL interagieren.

In gewisser Weise führt diese Interaktion dazu, dass WordPress ähnlich wie die oben erwähnten Back-End-JavaScript-Frameworks funktioniert und die Struktur der Anwendungs- und Datenbankverwaltung ohne das zwischengeschaltete PHP bereitstellt. Es ist nichts Neues für WP, so zu arbeiten – das macht schließlich ein CMS –, aber die Implementierung und Integration mit JavaScript-Bibliotheken und JSON sind es

Während React Native dies speziell für mobile Apps tun kann, können Sie auch jedes Front-End-Framework oder jede Bibliothek verwenden, um dasselbe zu tun – Vue.js und Ember und normales altes React (oder Preact, wenn Sie böse sind).

Und wenn Sie wirklich böse sind, können Sie eine dieser Bibliotheken nehmen, Ihre Site erstellen und gerade genug Swift von Java verwenden, um sie in eine Webansicht zu packen und dank der REST-API in einem App Store zu veröffentlichen. Es ist ein bisschen hässlich, aber es sollte funktionieren.

Die Zukunft von WordPress

Matt sagte letztes Jahr, dass alle WordPress-Entwickler „JavaScript gründlich lernen sollten“.

Es ist Zeit, dass wir alle zuhören, denke ich. Ehrlich gesagt spielt es keine Rolle, welche JavaScript-Bibliothek oder -Bibliotheken Sie zuerst lernen möchten. Sobald Sie mit der Funktionsweise und Interaktion von WordPress vertraut sind, sind Sie auf dem besten Weg, ein Teil des JS-Ökosystems und damit der Zukunft von WP zu werden.

Egal, ob Sie ein großartiges Client-Erlebnis für Ihr Plugin wie Divi oder Ninja Forms machen möchten, eine großartige Web-App, bei der Ihre Benutzer schnelle und reibungslose Updates benötigen, oder eine mobile App, die nur WordPress als Back-End-Datenbank verwendet, es gibt JavaScript Bibliotheken gibt es dafür.

Miniaturansicht des Artikels von Creative Thoughts / shutterstock.com