App Development für Office 365 mit Napa – Eine Einführung

Mit SharePoint 2013 hält auch der “Apps”-Begriff Einzug in die Technologie. Apps sind ein komplett neues Entwicklungsmodell für SharePoint 2013, mit dem sich die SharePoint-Funktionalität um eine spezielle Anwendung erweitern lässt. Apps können dabei in einer beliebigen Sprache (JavaScript, HTML, PHP oder ASP.NET) realisiert und zum Beispiel in der Cloud gehostet werden. Wer Apps für SharePoint Online oder Office 365 entwickeln möchte, für den liefert Microsoft eine komplett neue webbasierte Entwicklungsumgebung namens Napa. Diese möchte ich heute vorstellen.

„Napa“ Office Development Tools – so lautet aktuell die vollständige Bezeichnung – ist ein Toolset mit dem sich Cloud Apps für SharePoint und Office 2013 über den Browser realisieren lassen. Napa selbst ist eine webbasierte App, die sowohl in einer On-Premise als auch in einer Office 365-Website installiert werden kann.

Zur Verwendung der Napa App muss zunächst einmal eine Developer Site in SharePoint oder Office 365 erzeugt werden. Danach erhält man über den Link „Add an app“ die Möglichkeit zur Installation der Napa App.

Nachdem man der Anwendung vertraut hat, wird diese installiert und steht zur Verwendung bereit. Der App-Link leitet den Nutzer zum Einstiegsbereich der Entwicklungsumgebung. Hierüber erhält man einen Zugriff auf seine entwickelten Apps sowie die Option, eine neue Cloud-Anwendung zu erstellen. Napa stellt derzeit vier Projektvorlagen bereit: App for SharePoint, Task Pane for Office, Content App for Excel und Mail App für Outlook.

In meinem Beispiel verwende ich die Vorlage „App for SharePoint“. Vergleichbar mit einer Visual Studio-Projektvorlage werden mit dem Prozess zur Erstellung eines neuen Projekts alle erforderlichen Dateien erzeugt.

Zu einer SharePoint Cloud App für Office 365 gehören folgende Dateien:

  • Default.aspx ist die Basisdatei der App.
  • ClientWebPart.aspx enthält den HTML-Code des Client Web Parts (kann in die SharePoint Site integriert werden)
  • App.js beinhaltet die Logik der App. Hierhin passiert der Zauber.
  • App.css definiert die CSS Style Sheets der App.
  • AppIcon.png ist das verwendete Icon.

Die Dateien sind so aufgebaut, dass man eigentlich direkt starten kann. Die Default.aspx sowie die App.js-Datei enthalten bereits eine Art „Hello Word“, welches ganz gut das App-Modell veranschaulicht. Die Default.aspx enthält sämtlichen HTML-Code sowie die Referenzen auf die Scripts und sonstigen Ressourcen. Die gesamte Logik steckt in der App.js, in der bereits ein einfaches Beispiel zu finden ist: über die getUserName-Methode wird mit Unterstützung des JavaScript-Objektmodells der Anzeigename des aktuell angemeldeten Benutzers ausgelesen.

Die clientseitigen Programmierschnittstellen wurden im Vergleich zur Vorversion deutlich erweitert. Neu ist nicht nur die Möglichkeit, auf Enterprise-Dienste (Suche, Term Store, Profile etc.) zuzugreifen, auch die ausgedehnte Verfügbarkeit von REST wird den einen oder anderen Entwickler freuen. Der client.svc Service wurde so ausgelegt, dass er die Interaktion mit SharePoint-Daten und Services via REST und OData vollständig unterstützt. Diese Neuerung wird vor allem den Entwicklern zugute kommen, die noch nicht so tief im SharePoint-Objektmodelle stecken.

Zurück zu Napa. Die webbasierte Entwicklungsumgebung stellt für die Umsetzung von individuellen Lösungen einige interessante Features bereit. Die wichtigsten möchte ich kurz vorstellen:

Code und Syntax Highlighting
Markiert man eine Variable innerhalb der App.js wird diese in der gesamten Datei grafisch hervorgehoben.

Zeilennummern und Code-Einrückung
Unterscheidet sich eigentlich gar nicht zu Visual Studio.

Auto-Vervollständigung für JavaScript und CSS
Die IntelliSense kann auch über Strg+Leertaste geöffnet werden

Fehlerhervorhebung

Refactoring

Neben diesen Features gibt es noch weitere nette Gimmicks, die man aber selbst ganz gut erkunden kann.

Über das Eigenschaftsfester kann die App konfiguriert werden. Genauer genommen handelt es sich hierbei um einen Designer, mit dem das App Manifest bearbeitet wird. Vergleichbar mit dem Solution Manifest ist das App Manifest eine XML-basierte Datei, in der sämtliche Einstellungen der App hinterlegt werden. Der Editor ermöglicht unter anderem die Definition von Basisattributen (Titel, Name, Icon etc.), die Vergabe von dynamischen Token (die dann zur Laufzeit der App ersetzt werden) sowie die Spezifizierung von erforderlichen Rechten auf den Inhalt der Site Collection sowie auf bestimmte Dienste.

Die Rechte werden in Form von OAuth Permissions im App Manifest hinterlegt. Sie dienen dazu, dem Nutzer während der Installation der App zu signalisieren, welche Privilegien diese App (vom Nutzer) erfordert.

Nachdem die App fertig ist, kann sie gebaut und debuggt werden.

In diesem Prozess wird das App Web innerhalb in die Zielumgebung deployt, das App Manifest registriert sowie die Anwendung in einem neuen Fester geöffnet. Da die Logik der App komplett auf Client Code basiert, kann das Debugging mit Unterstützung von Browser Tools, wie IE DEV Toolbar oder Firebug erfolgen.

Wer möchte, kann das komplette Projekt auch nach Visual Studio exportieren (funktioniert erstaunlich gut) oder die App zur weiteren Nutzung veröffentlichen.

In Summe muss ich zugeben, dass ich vom Funktionsumfang von Napa schon sehr überrascht bin. Ich hätte nicht gedacht, dass Microsoft all diese Features in eine webbasierte Anwendung so schnell unterbringen kann. Bleibt abzuwarten, ob Microsoft hiermit die neue Klientel erreicht, die es hiermit adressieren möchte.

Ich werde an dieser Stelle noch mehr von der App-Entwicklung und den damit verbundenen Möglichkeiten berichten. Geplant sind Artikel zu REST / oData sowie zur Absicherung von Apps via OAuth.

, , , ,

Keine Kommentare

Hinterlasse eine Antwort