fier d’être développeur office et sharepoint !

Donnez votre avis !

Depuis votre smartphone, sur :

http://notes.mstechdays.fr

De nombreux lots à gagner toutes les heures !!!

Claviers, souris et jeux Microsoft…

Merci de nous aider à améliorer les TechDays

http://notes.mstechdays.fr

Fier d’être <DEV> Office et

SharePoint

Olivier Carpentier (Microsoft)

David Rei (Microsoft)

Code / Développement

LAN304

Code / Développement

Agenda

1 2 3 4

Les nouveautés pour le

développement

Code / Développement

Les nouveautés pour le développement

CSR

JSLink

C’est quoi une App ?

Code / Développement- 6

Pour SharePoint

Une extension réutilisable « à la facebook »

Pour Office

Un type « d’add-in »

Les avantages des Apps en 2013

GESTIONCENTRALISEE

DE CATALOGUES

CONNAISSANCE.NET NON

OBLIGATOIRE

HYBRIDE CLOUD

DEVELOPPEMENTPOSTE CLIENT

SIMILAIRE ON PREMISE

ET ONLINE

Des outils de développements pour tous les niveaux

Code / Développement

Access 2013,Office Templates with Apps

Le moyen le plus facile pour les non développeurs de créer et publier

une application

Visual Studio 2012

Outil complet pour réaliser tousles besoins. Nécéssite les

compétences de développeurs

“Napa” Office 365 Development Tools

Un outil en ligne pour un déploiement d’app basée sur

Javascript

Apps pour Office

Code / Développement

• Task Pane pour Office– Disponible dans Excel, Word et Project

• Content App– Embarquée dans le document

– Pour Excel et Excel Web App

• Mail App– Permet d’enrichir l’interface utilisateur et les fonctionnalités d’Outlook

– (Messages et Rendez-vous).

– Nécessite Exchange 2013 (Les comptes POP et IMAP ne sont pas supportés)

– Seulement dans le client Outlook et OWA

Les types d’Apps pour Office

Code / Développement

Matrice des types d’Apps supportées

Office App Office Web App

Task Pane Excel

Word

Project

Excel

Content App Excel Excel

Mail App Outlook Outlook

APPS POUR OFFICE

LAN304

Code / Développement

Apps pour SharePoint

Les différentes formes d’Apps pour

SharePoint

Code / Développement

Full page

Pages complètes dédiées.

Expérience immersive complète

App Parts

“Web Parts” ajoutable dans les pages des

sites SharePoint

UI command extensions

Extension par ajout d’éléments au sein des

menus contextuels ou du rubban

• Web Part de type Iframe, échangeant des propriétés par querystring

• Les propriétés sont typées :– Int, Bool, String, Enum

Code / Développement

C’est quoi une App Part ?

<?xml version="1.0" encoding="UTF-8"?><Elements xmlns="http://schemas.microsoft.com/sharepoint/">

<ClientWebPart Title="Basic app part" Name="Basic app part" Description="" ><Content

Src="~remoteAppUrl/AppPartContent.html?strProp=_strProp_&amp;intProp=_intProp_&amp;…."Type="html"/>

<Properties><Property

Name="strProp"Type="string"RequiresDesignerPermission="true"DefaultValue="String default value"WebCategory="Basic app part category"WebDisplayName="A property of type string.">

</Property></Properties>

</ClientWebPart></Elements>

Les différents moyens d’héberger une App

Code / Développement

SharePoint

App Web

SharePoint

Host Web

SharePoint-Hosted app

Hébergement 100% SharePoint, isolé en sous-site- Use SP artifacts & out-of-box web parts- Use HTML & JavaScript for UI & client-side logic- Use Workflows for middle tier logic

Provider-hosted app

Hébergement personnalisé (exemple: IIS, Apache, etc.)

- Use server code- Receive SP events- Use OAuth to access SP

Cloud-hosted apps

Your Hosted

Site

Autohosted app

Windows Azure + SQL Azure automatiquement provisonnés pour l’app

Azure SharePoint

Host Web

SharePoint

Host Web

Code / Développement

Le package d’une App

- 18

.app

.WSP

(SharePoint

Elements)

.CSPKG

(Azure

Elements)

appmanifest.

xml

• Fichiers de type *.app

• Forme de cab (archive zip)

• Les resources SharePoint sont stockées dans un

fichier .WSP (user solution), appliqué sur le host

web lors de l’installation

• Les resources Azure sont stockées dans un fichier

.cspkg

• Un fichier Manifest XML declare les

caractéristiques de l’app :

– App permission

– URLs

SharePoint Farm

Cloud

Cycle de vie des Apps en entreprise

Code / Développement

MarketPlace

Apps Service

Application

Cloud

Web App #1

Azure Web

Site

External Web

Site (IIS ?)

Catalogs Mngt

Licences Mngt

Tenants Mngt

Perms Mngt

Monitor Apps

*.app download

Authorized App

Delegation

SP hosted App

Auto hosted

App

App Developer SiteInternal App

Promotion

Provider

hosted App

File System

*.app

Code / Développement

La communication entre SharePoint

et les Apps

- 20

Host web App web et/ou Dedicated web

OAuth

Lists /

Libs /

Webs

Lists /

LibsWeb ServicesRemote Event Receiver

Pages (SP Hosted App)JavaScript Client Object Model (JSCOM)

Pages (no SP. H. App)Client Object Model (CSOM)

APPS POUR SHAREPOINT

LAN304

Code / Développement

Client Side Rendering

SharePoint 2010 / XSL

Historique / Expérience de

personnalisation

SharePoint 2013 /

CSR

SharePoint 2007 /

CAML

Code / Développement

Callouts

• Boite de dialogue contextuelle

à un élément

var calloutOptions = {

launchPoint: document.getElementById("targetElement"),

ID: "Unique ID",

title: "Location",

content: "<div></div>",

beakOrientation: "leftRight",

};

var callout =

CalloutManager.createNew(calloutOptions);

Header

Footer

(Avec des actions)

Content

(<div></div>)

Code / Développement

JS Link

• Possibilité de spécifier un

Javascript pour effectuer

un rendu coté client.

• Utilisable sur – Fields

– Views

– Content Types

– Quelques WebParts

Code / Développement

Les acteurs (1/2)

• SPClientTemplates, SPClientForms

– Liaison avec la structure SharePoint

– Surchage des modèles d’affichage possibles

• SPClientRenderer

– Fonction générique permettant le rendu coté client

– Pas de dépendance avec les API / données SharePoint

SPClientRenderer.Render(HTMLElement placeHolder, RenderContext rCtx);

Code / Développement

Les acteurs (2/2)

RenderContext

ListData

ListSchema

ControlMode

BaseViewId

ListTemplateType

OnPreRender

OnPostRender

Templates

SPClientTemplates.TemplateManager.RegisterTemplateOverrides(

RenderContext rCtx);

CLIENT SIDE RENDERING /

JSLINK

LAN304

Code / Développement

• Définir et associer un fichier JS

• Création d’un RenderContext local

• Surcharge du modèle d’affichage

– Templates

– OnPreRender / OnPostRender

• Définition de l’étendue

– ControlMode

– BaseViewID

– ListTemplateType

• Enregistrement du modèle

– SPClientTemplates.TemplateManager.RegisterTemplateOverrides(

RenderContext rCtx

);

Synthèse : Méthode de personnalisation

Code / Développement

• Apps pour Office

• « SharePoint hosted » Apps

• Expérience de développement Visual Studio 2012 et

online

• JavaScript everywhere !– CSOM / JSOM

– CSR

– JSLink

– Callouts

Ce que nous avons vu ensemble

aujourd’hui

http://www.devcamps.ms/office

www.confsharepoint.com

Venez nombreux à la Conf’SharePoint !

Merci !

Code / Développement

Votez ici ! Olivier Carpentier

David Rei

Microsoft

LAN304