© Kellie L. Folkerts/Shutterstock.com
Einführung in das SharePoint Framework (Teil 4)

SharePoint-Entwickler-Kolumne


In der letzten Kolumne wurde das neue SharePoint Framework (kurz: SPFx) vorgestellt. Dabei wurde gezeigt, wie eine Entwicklungsumgebung aufgesetzt und ein erstes einfaches clientseitiges Web Part umgesetzt werden kann. Bisher konnte dies ganz autonom ohne eine Verbindung mit SharePoint erfolgen.

Wie in der letzten Ausgabe [1] deutlich wurde, ermöglicht das neue SPFx die Realisierung von SharePoint-Lösungen ohne eine direkte Verbindung mit SharePoint. Die Installation und die Bereitstellung einer Entwicklungsumgebung sind somit wesentlich einfacher, da keine SharePoint-Instanz benötigt wird. Jedoch gelangt man irgendwann immer an den Punkt, an dem man auf SharePoint zugreifen muss. Ansonsten würde es sich nicht um eine SharePoint-basierte Lösung handeln. Jedoch ist es mit Blick auf den Entwicklungsprozess zu empfehlen, wie im nächsten Abschnitt noch deutlich werden wird, konkrete SharePoint-Zugriffe erst möglichst zum Ende des Entwicklungsprozesses hin zu integrieren. Die heutige Kolumne geht daher im Schwerpunkt auf das clientseitige SPFx API ein und beschreibt Möglichkeiten, wie SharePoint-Daten simuliert werden können. Für rein Microsoft-basierte Entwickler hat sich die Entwicklung unter dem SPFx wesentlich verändert, wie die letzte Ausgabe der Kolumne verdeutlicht hat.

Abbildung 1 zeigt daher noch einmal eine Übersicht der verwendeten Software und stellt sie den entsprechenden Microsoft-Werkzeugen gegenüber. Wie erkennbar ist, kann Node.js als IIS-Express-Variante angesehen werden. Node.js stellt die notwendige Hosting-Umgebung bereit und ermöglicht auch die Einbindung von serverseitigem Code. Die Erweiterung npm (Paketmanager für JavaScript) ist als Gegenstück zum Paketmanager NuGet einzuordnen. Mittels npm können sehr einfach Pakete inklusive Versionen und Abhängigkeiten innerhalb eines Projekts verwaltet werden. Mittlerweile ist die npm-Datenbank mit über 600 000 Paketen die größte Softwarepaketverwaltung der Welt. MSBuild wird in der SPFx-Entwicklung durch gulp ersetzt. gulp ermöglicht die Definition von Aufgaben (Tasks), die während der (Debug-/Release-)Bereitstellung ausgeführt werden sollen. Innerhalb eines typischen SPFx-basierten Projekts sind die in Abbildung 2 zu sehenden Aufgaben definiert.

image

Abb. 1: Gegenüberstellung SPFx-Hilfsprogramme und Microsoft-Produkte

image

Abb. 2: Definierte gulp-Aufgaben (Tasks)

Um die Anlage eines SharePoint-SPFx-Projekts zu vereinfachen, steht mit Yeoman ein Templatemanager zur Verfügung. Dieser ermöglicht die Auswahl einer installierten Vorlage, und anschließend legt der Generator die definierte Projektstruktur gemäß der gewählten Vorlage an. Vergleichbar ist dieser Vorgang mit dem Schritt der Projektvorlagenauswahl in Visual Studio während der Anlage eines neuen Projekts. Die wesentliche Änderung für alle Entwickler, die bisher ausschließlich in der Microsoft-Entwicklungsumgebung mit einer typischen .NET-Sprache gearbeitet haben, ist die verwendete Programmiersprache. Da mittels SPFx rein clientseitige Erweiterungen umgesetzt werden, wird für die Implementierung TypeScript eingesetzt. TypeScript kommt hier während der Entwicklung zum Einsatz, dient aber nur als Zwischensprache, die anschließend in einen reinen JavaScript-Code übersetzt wird. Gegenüber JavaScript bietet TypeScript aber viele Vorteile für den Entwickler. Die Sprache ist für C#-Entwickler relativ schnell zu erlernen und dank der IntelliSense-Unterstützung sowie Codevervollständigung in Visual Studio (oder auch VS Code) schnell beherrschbar.

SPFx-Entwicklungszyklus

Bevor nun im nächsten Abschnitt auf spezielle API-Methoden eingegangen wird, verdeutlicht Abbildung 3 zunächst zusammenfassend den vollständigen Entwicklungszyklus.

image

Abb. 3: Entwicklungszyklus

Nachdem die benötigten Softwarekomponenten für die SPFx-basierte Entwicklung installiert wurden, kann die Umsetzung beginnen. Als Erstes muss dazu für Yeoman die spezielle SharePoint-Vorlage für SPFx-basierte Projekte installiert werden. Danach wird diese Vorlage für die Anlage eines neuen Projekts verwendet. Nachdem dann von Yeoman die Projekt...

Neugierig geworden? Wir haben diese Angebote für dich:

Angebote für Gewinner-Teams

Wir bieten Lizenz-Lösungen für Teams jeder Größe: Finden Sie heraus, welche Lösung am besten zu Ihnen passt.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang