Tout comme Windows 8 et Windows Phone, Office et SharePoint se met aux Apps ! Avec le nouveau modèle de développement orienté Web (HTML5, Javascript, Azure), la conception applicative d’extensions pour Office et SharePoint va changer durablement. Quelles sont les différents types d’applications que l’on peut développer autour d’Office et SharePoint ? Quels sont les principes de ce nouveau modèle de développement orienté Cloud ? Quelles sont les bonnes pratiques pour publier, diffuser et vendre vos applications sur le store Office ou au sein d’un catalogue privé d’entreprise ? Nous démystifierons tous les concepts obscurs ! Vous serez surpris de découvrir qu’en tout développeur Web sommeille un potentiel développeur Office et SharePoint…

1. 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

2. Fier d’être <DEV> Office et
SharePoint
Olivier Carpentier (Microsoft)
David Rei (Microsoft)
LAN304
Code / Développement

3. Agenda
1 2 3 4
Code / Développement

4. Les nouveautés pour le
développement

5. Les nouveautés pour le développement
CSR
JSLink
Code / Développement

6. C’est quoi une App ?
Pour Office
Un type « d’add-in »
Pour SharePoint
Une extension réutilisable « à la facebook »
Code / Développement -6

7. Les avantages des Apps en 2013
SIMILAIRE DEVELOPPEMENT GESTION CONNAISSANCE HYBRIDE
ON PREMISE POSTE CLIENT CENTRALISEE .NET NON CLOUD
ET ONLINE DE CATALOGUES OBLIGATOIRE

8. Des outils de développements pour tous les niveaux
Access 2013, “Napa” Office 365 Visual Studio 2012
Office Templates with Apps Development Tools
Le moyen le plus facile pour les non Outil complet pour réaliser tous
Un outil en ligne pour un
développeurs de créer et publier les besoins. Nécéssite les
déploiement d’app basée sur
une application compétences de développeurs
Javascript
Code / Développement

9. Apps pour Office

10. Les types d’Apps pour Office
• 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
Code / Développement

11. Matrice des types d’Apps supportées
Office App Office Web App
Task Pane Excel Excel
Word
Project
Content App Excel Excel
Mail App Outlook Outlook
Code / Développement

12. LAN304
APPS POUR OFFICE
Code / Développement

13. Apps pour SharePoint

14. Les différentes formes d’Apps pour
SharePoint
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
Code / Développement

15. C’est quoi une App Part ?
• Web Part de type Iframe, échangeant des propriétés par
querystring
<?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 propriétés sont typées :
– Int, Bool, String, Enum
Code / Développement

16. Les différents moyens d’héberger une App
Provider-hosted app SharePoint
Host Web Your Hosted
Cloud-hosted apps Hébergement personnalisé (exemple: IIS, Site
Apache, etc.)
- Use server code
- Receive SP events
- Use OAuth to access SP
Autohosted app SharePoint
Host Web Azure
Windows Azure + SQL Azure
automatiquement provisonnés pour l’app
SharePoint-Hosted app SharePoint
Host Web
Hébergement 100% SharePoint, isolé en sous-site
- Use SP artifacts & out-of-box web parts
- Use HTML & JavaScript for UI & client-side logic
SharePoint
- Use Workflows for middle tier logic App Web
Code / Développement

17. Le package d’une App
• Fichiers de type *.app
• Forme de cab (archive zip) .app
• Les resources SharePoint sont stockées dans un appmanifest.
xml
fichier .WSP (user solution), appliqué sur le host
web lors de l’installation .WSP
(SharePoint
• Les resources Azure sont stockées dans un fichier Elements)
.cspkg .CSPKG
• Un fichier Manifest XML declare les (Azure
Elements)
caractéristiques de l’app :
– App permission
– URLs
Code / Développement - 18

18. Cycle de vie des Apps en entreprise
Catalogs Mngt
Licences Mngt
Tenants Mngt
Perms Mngt
Monitor Apps Provider
hosted App External Web
Site (IIS ?)
Apps Service
Application
SP hosted App
Authorized App
Delegation
*.app download
MarketPlace
Cloud Azure Web
Auto hosted Site
App
Internal App
*.app Promotion App Developer Site Web App #1
File System SharePoint Farm Cloud
Code / Développement

19. La communication entre SharePoint
et les Apps
OAuth
JavaScript Client Object Model (JSCOM) Pages (SP Hosted App)
Lists /
Libs /
Webs Client Object Model (CSOM)
Pages (no SP. H. App)
Lists /
Remote Event Receiver Web Services
Libs
Host web App web et/ou Dedicated web
Code / Développement - 20

20. LAN304
APPS POUR SHAREPOINT
Code / Développement

21. Client Side Rendering

22. Historique / Expérience de
personnalisation
SharePoint 2007 / SharePoint 2010 / XSL
CAML
SharePoint 2013 /
CSR

23. Callouts Header
• Boite de dialogue contextuelle
à un élément
var calloutOptions = {
launchPoint:
document.getElementById("targetElement"), Content
ID: "Unique ID", (<div></div>)
title: "Location",
content: "<div></div>",
beakOrientation: "leftRight",
};
var callout = Footer
CalloutManager.createNew(calloutOptions); (Avec des actions)
Code / Développement

24. 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

25. 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

26. Les acteurs (2/2)
RenderContext
ListData ControlMode OnPreRender Templates
ListSchema BaseViewId OnPostRender
ListTemplateType
SPClientTemplates.TemplateManager.
RegisterTemplateOverrides(
RenderContext rCtx
);
Code / Développement

27. LAN304
CLIENT SIDE RENDERING /
JSLINK
Code / Développement

28. Synthèse : Méthode de personnalisation
• 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
);

29. Ce que nous avons vu ensemble
aujourd’hui
• Apps pour Office
• « SharePoint hosted » Apps
• Expérience de développement Visual Studio 2012 et
online
• JavaScript everywhere !
– CSOM / JSOM
– CSR
– JSLink
– Callouts
Code / Développement

30. http://www.devcamps.ms/office

31. Venez nombreux à la Conf’SharePoint !
www.confsharepoint.com

32. Merci !
Votez ici ! 
Olivier Carpentier
David Rei
Microsoft
LAN304
Code / Développement