Transcript Donnez votre avis ! Depuis votre smartphone, sur : http://notes.mstechdays.fr De nombreux lots à gagner toutes les heures !!! Claviers, souris et jeux Microsoft… Merci.

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)
LAN304
Code / Développement
Agenda
1
Code / Développement
2
3
4
Les nouveautés pour le
développement
Les nouveautés pour le développement
CSR
JSLink
Code / Développement
C’est quoi une App ?
Pour Office
Un type « d’add-in »
Pour SharePoint
Une extension réutilisable « à la facebook »
Code / Développement
-6
Les avantages des Apps en 2013
SIMILAIRE
ON PREMISE
ET ONLINE
DEVELOPPEMENT
POSTE CLIENT
GESTION
CENTRALISEE
DE CATALOGUES
CONNAISSANCE
.NET NON
OBLIGATOIRE
HYBRIDE
CLOUD
Des outils de développements pour tous les niveaux
Access 2013,
Office Templates with Apps
Le moyen le plus facile pour les non
développeurs de créer et publier
une application
Code / Développement
“Napa” Office 365
Development Tools
Visual Studio 2012
Un outil en ligne pour un
déploiement d’app basée sur
Javascript
Outil complet pour réaliser tous
les besoins. Nécéssite les
compétences de développeurs
Apps pour Office
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
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
Code / Développement
LAN304
APPS POUR OFFICE
Code / Développement
Apps pour SharePoint
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
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
Les différents moyens d’héberger une App
Provider-hosted app
Cloud-hosted apps
- Use server code
- Receive SP events
- Use OAuth to access SP
Hébergement personnalisé (exemple: IIS,
Apache, etc.)
Autohosted app
Windows Azure + SQL Azure
automatiquement provisonnés pour l’app
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
Code / Développement
SharePoint
Host Web
SharePoint
Host Web
Your Hosted
Site
Azure
SharePoint
Host Web
SharePoint
App Web
Le package d’une App
• 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
appmanifest.
xml
.WSP
(SharePoint
Elements)
.CSPKG
(Azure
Elements)
– App permission
– URLs
Code / Développement
- 18
Cycle de vie des Apps en entreprise
Catalogs Mngt
Licences Mngt
Tenants Mngt
Perms Mngt
Monitor Apps
Provider
hosted App
Apps Service
Application
SP hosted App
Authorized App
Delegation
*.app download
External Web
Site (IIS ?)
MarketPlace
Cloud
Auto hosted
App
*.app
File System
Code / Développement
Internal App
Promotion
App Developer Site
SharePoint Farm
Azure Web
Site
Web App #1
Cloud
La communication entre SharePoint
et les Apps
OAuth
Lists /
Libs /
Webs
Lists /
Libs
Host web
Code / Développement
JavaScript Client Object Model (JSCOM)
Client Object Model (CSOM)
Remote Event Receiver
Pages (SP Hosted App)
Pages (no SP. H. App)
Web Services
App web et/ou Dedicated web
- 20
LAN304
APPS POUR SHAREPOINT
Code / Développement
Client Side Rendering
Historique / Expérience de personnalisation
SharePoint 2007 / CAML
SharePoint 2013 / CSR
SharePoint 2010 / XSL
Callouts
Header
• 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);
Code / Développement
Content
(<div></div>)
Footer
(Avec des actions)
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
SPClientTemplates.TemplateManager.
RegisterTemplateOverrides(
RenderContext rCtx
);
Code / Développement
OnPreRender
OnPostRender
Templates
LAN304
CLIENT SIDE RENDERING / JSLINK
Code / Développement
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
);
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
http://www.devcamps.ms/office
Venez nombreux à la Conf’SharePoint !
www.confsharepoint.com
Merci !
Votez ici ! 
Olivier Carpentier
David Rei
Microsoft
LAN304
Code / Développement