Erste Schritte mit unserem JavaScript SDK

KB2

Jedes Mal, wenn wir an einem Meetup teilnehmen oder auf einer Konferenz sprechen und das Thema Content Management Systeme angesprochen wird, hören wir immer wieder dasselbe.„Ich möchte mich nicht mit diesem Zeug herumschlagen.“Die tatsächliche Formulierung mag etwas deutlicher sein, aber die Bedeutung ist dieselbe. Wenn JavaScript-Entwickler*innen ein Content Management System (CMS) einrichten, denken sie an die Belastungen, die mit der Verwaltung von selbst gehosteten Systemen verbunden sind, die jede Woche aktualisiert werden müssen. Dazu gehören Sorgen um die Datenbankarchitektur, Skalierbarkeitsprobleme und andere DevOps-Protokolle. Deshalb schlagen wir eine neue Lösung vor: eine API-first, technologieunabhängige Content-Plattform. In diesem Artikel stellen wir die Vorteile der Verwendung von Contentful und einer Content-Plattform für Ihr nächstes JavaScript-Projekt vor.

Bevor wir fortfahren, ist es wichtig zu klären, was Sie mit Contentful erhalten. Über unsere Content-Plattform können Entwickler*innen jede Art von digitalem Content mit API-Aufrufen abrufen und Editor*innen erhalten eine vertraute Web-App zum Erstellen und Verwalten von Content. Im Gegensatz zu einem CMS geben wir Ihnen die Freiheit, Ihr eigenes Content-Modell zu erstellen, mit dem Sie die benötigten Datenstrukturen definieren können. Von dort aus stellen wir Ihnen RESTful-APIs zur Verfügung, damit Sie Content über mehrere Kanäle bereitstellen können – von Websites und mobilen Apps bis hin zu IoT, Virtual-Reality-Spielen oder allen anderen Fällen, die Sie sich vorstellen können. Ein beliebter Anwendungsfall für eine Content-Plattform sind Web-Apps, die JavaScript-Frameworks wie React, Angular und Vue.js verwenden. Oder Websites, die mit einem statischen Website-Generator erstellt wurden. Diese Verbindungen zur JavaScript-Community sind kein Zufall. Unsere Content-Plattform ist eine großartige Ergänzung für alle JS-Entwickler*innen, da sie mehr Kreativität ermöglicht als herkömmliche Content-Plattformen. Dies liegt daran, dass keine Frontend-Struktur angehängt ist. Es ist einfach ein Backend, das Content über eine RESTful API bereitstellt, sodass Sie es so gestalten können, wie Sie möchten. Und Sie können den gewünschten Hip-Stack auswählen – Ihre Daten sind nur einen Ajax-Aufruf entfernt.

Wir bieten SDKs für gängige Programmiersprachen wie JavaScript, Ruby, PHP und mehr an. Diese SDKs sollen Ihnen als Entwickler*in die Arbeit mit Contentful erleichtern und Ihnen einen nahezu sofortigen Zugriff auf unsere APIs und deren Funktionen ermöglichen. Ein weiterer großer Vorteil unserer JavaScript-SDKs ist, dass sie universell sind, d. h. sie sind so konzipiert, dass sie in einer Node.js-Umgebung und in Browsern funktionieren. Sehen wir uns nun an, wie das aussieht. Um das Content Delivery API (CDA)-SDK zu erhalten, haben Sie zwei Möglichkeiten. Sie können das npm-Paket installieren und in Ihren Code importieren:

How to get started with our JavaScript SDK / CS1

Oder Sie verwenden die vorgefertigte und verkleinerte JavaScript-Datei aus einem CDN:

How to get started with our JavaScript SDK / CS2

Anschließend können Sie mit dem folgenden Code-Snippet arbeiten, um Content aus Contentful abzurufen:

How to get started with our JavaScript SDK / CS3

Neben der echten Trennung zwischen Content und Präsentation gibt es einen weiteren Aspekt, der Front-End-Entwickler*innen zu Contentful zieht: die Images API.Unsere Images API ermöglicht das Abrufen und Bearbeiten von Bilddateireferenzen aus Assets. Sobald Sie ein unverändertes Bild abgerufen haben, können Sie es durch einfaches Anhängen eines Abfrageparameters in der Größe ändern und zuschneiden, seine Hintergrundfarbe ändern und in verschiedene Formate konvertieren. Mit unserer API können Sie responsive Bilder in der richtigen Größe bereitstellen und so genau das liefern, was Sie brauchen, und dabei Daten sparen. Weitere Informationen zu den Möglichkeiten finden Sie in der Referenzdokumentation für die Images API.

Wenn Sie Contentful verwenden, sind Sie in guter Gesellschaft. Wir sind selbst Entwickler*innen und verstehen, dass Sie, selbst wenn Sie alles rund um den Server lieben, wahrscheinlich keine Zeit damit verschwenden möchten, ein JavaScript-CMS selbst zu konfigurieren. Contentful ist so konzipiert, dass Sie innerhalb von Minuten einsatzbereit sind. Sie können in nur fünf Minuten ein Projekt erstellen und bereitstellen, das Daten von einer Node.js-Serverseite abruft. Wir haben auch eine Reihe von Node.js-Backend-Tutorials, die Ihnen bei Ihren ersten Schritten helfen. Um Ihnen den Einstieg zu erleichtern, haben wir ein Demo-Projekt auf der Grundlage der Vorlage „Produktkatalog“ von Contentful erstellt, damit Sie es sich selbst ansehen können. Sobald Sie Node installiert haben, führen Sie einfach die folgenden Befehle aus:

How to get started with our JavaScript SDK / CS4

Und schon kann es losgehen: Sie sollten nun in der Lage sein, diese Seite anzuzeigen, indem Sie https://localhost:3000 in Ihrem Browser öffnen. Um mit dem Hinzufügen und Verwenden Ihres eigenen Contents zu beginnen, können Sie die restlichen Schritte in diesem Tutorial zum Erstellen einer Express-JavaScript-Anwendung mit Contentful befolgen.

Wir empfehlen Ihnen, sich die Seite Contentful für JavaScript anzusehen, um Tutorials, Beispiel-Apps und mehr zu finden. Wenn Sie bereit sind, direkt loszulegen, erstellen Sie ein kostenloses Konto und beginnen Sie noch heute mit unserer Content-Infrastruktur zu arbeiten.