SharePoint Framework Teil 1: Die neue Spielzeugkiste für die SharePoint-Entwicklung

Im ersten Teil unserer Blogserie zum Thema “SPFX” befassen wir uns mit Neuerungen, die uns Microsoft mit der neuen, modernen Entwicklungs-Spielzeugkiste an die Hand gibt. Wenn wir einen Blick in unsere Kiste werfen, werden wir mit allerhand modernen Tools konfrontiert, die uns das SharePoint Entwickler-Leben vereinfachen sollen. Einige dieser Spielzeuge möchte ich Ihnen gerne in diesem Beitrag näherbringen, damit wir im späteren Verlauf auf die Vorteile der Änderungen eingehen können.

Was gibt es zu entdecken?

Modern WebParts

Mit der neuen intuitiven Benutzeroberfläche des Edit-Modes macht es uns Microsoft relativ einfach ganze Seiten mit Inhalten zu befüllen. Hier kommen die neuen, sog. „Modern WebParts“ zum Einsatz. Wer mit der Auswahl der Standard-WebParts nicht zurechtkommt, freut sich über den Inhalt unserer SharePoint-Spielzeugkiste. Diese beinhaltet allerhand nützliche Helfer um solche modernen WebParts zu bauen und auf die jeweiligen Anforderungen anzupassen.

Wem mein letzter Beitrag zum Thema „WebPart-Toolpane“ bekannt ist, erinnert sich an die Einschränkungen beim Editieren von WebParts in älteren SharePoint-Versionen. Mit Einzug der Modern WebParts hat sich auch das WebPart-Toolpane verbessert.

Unsere Spielzeugkiste hat auch hier die richtigen Werkzeuge parat, um WebParts mit allerhand Funktionen auszustatten und diese dem Nutzer mit Hilfe des neuen WebPart-Toolpane bereitzustellen. Das Tolle daran: Sie müssen die Seite nicht einmal neu laden, denn die Einstellungen werden einfach direkt übernommen.

Office UI Fabric

Office UI Fabric ist das neue offizielle Front-End Framework um Office 365-Anwendungen unter einem vereinheitlichten Branding zu erstellen. Auch SharePoint nutzt dieses Framework als Basis für seine Benutzeroberfläche. Was bedeutet das nun konkret?

Das SPFX ermöglicht uns die Implementierung von Office UI Fabric für die Entwicklung von SharePoint-Anwendungen. Im Kern ist das Framework eine Ansammlung an CSS-Klassen, die es dem User-Interface-Designer bzw. dem Front-End-Entwickler erlauben, in kurzer Zeit und mit geringem Aufwand Office 365-konforme Benutzeroberflächen zu bauen.

React Components

Neben dem bereits erwähnten Office UI Fabric, welches sich ausschließlich um das Aussehen des User-Interfaces kümmert, erhalten wir mit den sog. „React Components“ ein weiteres hilfreiches Werkzeug für unsere SharePoint-Entwicklung. Es handelt sich dabei um eine Ansammlung von fertigen Komponenten, die bereits mit diversen Funktionen einhergehen.

Unsere Kiste hat mit den „React Components“ bereits für viele Situationen das passende Tool parat. Denken Sie beispielsweise an Buttons, Listen, Tabs usw. All diese Elemente besitzen gewisse Grundfunktionen, die bei einer Neuentwicklung erst implementiert werden müssen. Mit der Anwendung einer React Komponente verfügen diese Elemente bereits über allerlei nützliche Funktionen. Das spart nicht nur Zeit, sondern vereinheitlicht auch die Entwicklung. Zudem können weitere Bausteine entwickelt werden, die sich nahtlos in das Framework eingliedern.

Beispiel der React-Components für Buttons aus dem UI Fabric Toolkit

(Quelle: https://developer.microsoft.com/de-de/fabric#/resources)

Branding / Theming

Quelle: https://developer.microsoft.com/en-us/fabric#/styles/themegenerator

Mit Auslieferung der „Modern Sites“ wurde auch das SharePoint-Theming überarbeitet. Die neuen „modern Themes“ können über ein Online-Tool, den Theme-Generator (siehe Abbildung oben), ganz einfach erstellt werden.

Auch in der Entwicklung profitieren wir von den neuen Themes. So können (und sollten) Eigenentwicklungen beispielsweise auch Farben aus den Themes nutzen. Ändert sich eine Farbe im Theme hat das direkte Auswirkungen auf die entwickelten Komponenten. Redakteure haben die Möglichkeit, das Theme pro Site anzupassen und können dabei aus einer Liste aller vorhandenen Farbpaletten wählen.

Ausblick auf den zweiten Teil: Welchen Benefit haben diese Neuerungen und welche Möglichkeiten ergeben sich dadurch?

In der Fortsetzung des Artikels befassen wir uns mit den folgenden Themen:

• Von effektivem Prototyping bis hin zum Endprodukt
• Verlagerung der Umsetzungszeit für Standardfunktionen
• Bessere Möglichkeiten frühzeitig Nutzer einzubinden

Dabei finden wir heraus, wie wir in der SharePoint-Entwicklung von diesen Punkten profitieren können. Ziel soll es am Ende sein, ein Produkt zu erhalten, dass die ständig wachsenden Anforderungen an ein modernes Intranet bedienen kann.

Wenn Sie mehr zum Thema “SPFX” erfahren möchten, stehen wir gerne zur Verfügung!