BASIC App [72%]: Best-Practices – JSON und REST im Einsatz

Dennis Hüggenberg

Anzeige

Du betreibst einen eigenen Blog mit WordPress, hast Erfahrung mit HTML5, CSS und JavaScript und wolltest eigentlich schon immer eine eigene App für deinen Blog entwickeln? Dann ist diese Kolumne genau das Richtige für dich. Heute kümmern wir uns um die Bereistellung der Daten mit Hilfe von JSON und REST. Mit der Entwicklung der BASIC App stehen wir bei 72 Prozent. // von Dennis Hüggenberg


Warum ist das wichtig?

Neben dem Design und der Bedienbarkeit stellt der Content die wichtigste Komponente deiner eigenen App dar. Der Einsatz moderner Technologien ist heutzutage genauso wichtig wie die Geschwindigkeit und die Effizienz bei der Umsetzung deines Projektes. Daher werden wir uns in diesem Artikel mit den richtigen WordPress-Plugins, REST-Schnittstellen und JSON  auseinander setzen. 

Mehr zu diesem Thema


In den letzten Wochen ging es in meiner Kolumne um die Themen Projektmanagement, Design, Prototypenentwicklung und weiteren, spannenden Themen. Heute stehen bei uns die Daten im Vordergrund. Am Ende des Beitrages bist du in der Lage, die Daten aus deinem eigenen WordPress-Blog für deine eigene App bereitzustellen. Dazu werfen wir einen Blick hinter die Kulissen des WordPress-Plugin WP-REST-API, beschäftigen uns mit JSON und versuchen diese Dinge dann mit Ionic zusammen zu bringen.

UPDATE Newsletter BASIC thinking

Du willst nicht abgehängt werden, wenn es um KI, Green Tech und die Tech-Themen von Morgen geht? Über 10.000 Vordenker bekommen jeden Tag die wichtigsten News direkt in die Inbox und sichern sich ihren Vorsprung.

Nur für kurze Zeit: Anmelden und mit etwas Glück Beats-Kopfhörer gewinnen!

Mit deiner Anmeldung bestätigst du unsere Datenschutzerklärung. Beim Gewinnspiel gelten die AGB.

Bereitstellung der Daten

Eine der ersten Fragen, die bei fast jedem Projekt gestellt wird, ist die Frage nach den Daten. Es gibt sehr viele Wege, auf die Daten eines auf WordPress basierenden Blogs zuzugreifen. In diesem Beispiel werden wir die Daten via Representational-State-Transfer-Schnittstelle (REST) im JavaScript-Object-Notation-Format (JSON) bereitstellen. Das hört sich auf den ersten Blick zugegebener Maßen erst einmal sehr kryptisch an, aber du wirst sehen, dass es gar nicht so schwer ist.

Die Aufbereitung der Daten übernimmt das Plugin WP-REST-API. Um das Plugin zu installieren meldet du dich im Backend deines WordPress-Blogs an und suchst im Plugin-Repository nach „WP-REST-API“. Hast du das Plugin erfolgreich installiert, werden dir die benötigten Daten im JSON-Format über eine URL zur Verfügung gestellt.

Ein Beispielaufruf einer URL, um alle Blog-Posts auszugeben, würde dann so aussehen:

http://www.meine-url.de/wp-json/posts

JSON API

JSON-Daten strukturiert darstellen

Die Darstellung der Inhalte erscheint auf dem ersten Blick sehr unübersichtlich. Um mit den Daten strukturiert arbeiten zu können, möchte ich dir den JSON Online Editor ans Herz legen. Mit Hilfe dieses großartigen Werkzeugs kannst du dir die Inhalte in einer geordneten Objekt-Struktur ansehen. Dazu muss du einfach nur den gesamten Inhalt deiner URL kopieren und in das Tool einfügen:

JSON

Man kann erkennen, dass mit Hilfe des Plugins ein Array mit 12 Objekten zurückgegeben wird. Jedes Objekt stellt dabei einen Post in deinem Blog dar. In einem der Objekte sind alle Informationen eines Beitrages enthalten. Werfen wir doch einmal einen Blick auf die Struktur eines einzelnen Objektes:

JSON REST API

Fazit & Ausblick

Mit dem Plugin WP-REST-API bist du in der Lage, die Daten deines eigenen WordPress-Blogs für deine eigene App binnen Minuten bereit zu stellen. Mit Hilfe des JSON Online Editors kannst du die JSON-Streams strukturiert begutachten. Damit wären die wichtigsten Voraussetzungen für das Einbinden der Daten in deine App erfüllt. Im kommenden Beitrag gucken wir uns an, wie wir das Ionic-Framework mit diesen Daten verheiraten. Den Prototypen werde ich bis zum kommenden Donnerstag aktualisieren. Die Entwicklung der App schreitet voran. Aktuelle News dazu gibt es auch auf meinem Twitterkanal @hueggenberg.

🤝 25 Euro geschenkt!

Eröffne jetzt dein kostenloses NIBC Tagesgeld und erhalte bis zu 2,75 Prozent Zinsen auf dein Geld! Und obendrauf gibt's sogar noch 25 Euro geschenkt!


Jetzt Zinsen sichern

Voraussetzungen gelten, Anzeige

STELLENANZEIGEN
Graphic Designer & Content Creator (m/w/d)
FamiCord AG in Leipzig
Senior SAP Consultant FI/CO (f/m/div.)
Bosch Gruppe in Wetzlar
SAP Project Manager (m/w/d)
Bosch Gruppe in Stuttgart
Werkstudent*in Online Marketing (w/m/div)
Sparda-Bank Berlin eG in Berlin
Key Account Manager (m/w/d) im Bereich Online...
AZ fundraising services GmbH & Co. KG in Gütersloh
PreMaster Program | Software Engineer for MEM...
Bosch Gruppe in Reutlingen
Intern/Working Student (m/f/d) in Generative AI
Clarios Germany GmbH & Co. KG in Hannover
Intern (m/f/d) in Digital Marketing
Clarios Germany GmbH & Co. KG in Hannover
Teile diesen Artikel
Dennis Hüggenberg ist Projektleiter und Hobby-Entwickler. Kleine, raffinierte, mit schicken Oberflächen versehenen Applikationen faszinieren ihn. Freunde & Familie bilden das Zentrum seines Offline-Daseins.