Download - Office appsbiwugpresentation
SharePoint 2013Apps, Apps, Apps
Andy Van Steenbergen
About me
Andy Van SteenbergenSenior SharePoint consultant @ OrdinaSP Competence Center LeadLesgever @ CVO Antwerpen
@Meligo#SharingIsCaring
Blog.meligo.be
MicrosoftExtendedExpertTeamMember
Let’s start
SharePoint
So why the need for Apps in SharePoint?
Sites
Vie
ws
Columns
Libra
riesPages
List
sWeb Parts
WorkflowsM
ast
er
Pag
es
SolutionsFe
atu
res
Conte
nt Ty
pes
Docu
ments
So why the need for Apps in SharePoint?
Sites
Vie
ws
Columns
Apps
Libra
riesPages
List
sWeb Parts
WorkflowsM
ast
er
Pag
es
SolutionsFe
atu
res
Conte
nt Ty
pes
Docu
ments
App Hosting
App Web (from WSP)
HostwebSharePoint-hosted
AppReuse (lists, out-of-box web
parts)Client side technologies and
declarative workflows
Provider-hosted App
“Bring your own server hosting infrastructure”
SharePoint
Web
Get remote events from SharePoint Use CSOM/REST + OAuth
Cloud-hosted apps
Your Hosted
Site
Auto-hosted AppWindows Azure + SQL
Azure provisioned automatically as apps
are installed
Azure SharePoint Web
SharePoint Office Store
SharePoint App Catalog
Web Browser
Anatomy of a SharePoint Hosted app
Manifest
Code
JS CSS
HTML ASPX
Reasons to use SharePoint hosted apps
INHERENT MULTI-TENANCY
& ISOLATION
NO ADDITIONALCOST
NO NEED FOR ADDITIONAL
INFRASTRUCTURE
AUTHENTICATION IS AUTOMATIC
SYMMETRIC IN OFFICE 365AND ON-PREM
The isolated domain
http://app-bdf2016ea7dacb.contosoapps.com/sites/Biwug/Poll
Host web
http://intranet.contoso.com/sites/Biwug
App webPoll App
/Poll
App prefix (tenant)
App ID
App domain
Host web
App name
http://app-bdf2016ea7dacb.contosoapps.com/sites/Biwug/Poll
SharePoint component isolation1 app installation = 1 “app web”
App webs are isolated in their own domain:
Leverages web browser same-origin policy for script isolation
Host web
App web
https://contoso.sharepoint.com/site/
https://contoso-appUID.sharepoint.com/site/app/
Apps for Office
What are Apps for Office?
Content Area
Also known as Agaves . . .
Task Pane
Apps for Office: Supported typesApplication Supported types
Excel 2013 •Task pane•Content
Excel Web App •Content
Word 2013 •Task pane•Content
Outlook 2013 •Mail (content)
Outlook Web App •Mail
PowerPoint 2013 •Task pane•Content
Project Professional 2013 •Task pane•Content
App Shapes for Office
Task Pane
App adjacent to the document
ContentApp in the body of the document
Mail Inline Pane on an email or appointment item
App Shapes for Office
Task Pane
App adjacent to the document
ContentApp in the body of the document
Mail Inline Pane on an email or appointment item
App Shapes for Office
Task Pane
App adjacent to the document
ContentApp in the body of the document
Mail Inline Pane on an email or appointment item
Apps for Office: Spectrum
Pro DevPower User
Familiar Toolset Across Skill Levels
Access Services 2013
The easiest way for a non-developer to build and
publish apps for SharePoint
Visual Studio 2012
A great end-to-end development experience for highest customization
“Napa” Office 365 Development Tools
A lightweight, in-browser development experience
Apps for Office
Apps for SharePoint
From Developer to End User
Dev center
submission
Office Store
Integrated
Office Store
DirectVendor/
IT projects
SharePointApp
Catalog
TRIAL/ PURCHASE
TRIAL/PURCHASE
Office and SharePoint
Developer
End users
IT admin
ServerClient
Bro
wse
r Hos
t
Common App Architecture
Web Server H
ostClient-side Logic
HTML / CSS / Javascript
Office JS SharePoint JS (CSOM)
SharePoint&
Exchange
Server-side LogicAny language
Office
Web
App
s
Win
RT
Mac
Mob
ile
Win
32
APPProvider-hosted
Oth
erE.
g. L
AM
P
IIS /
ASP
.Net
Win
dow
sAzu
re
CSOM REST
On-premises
IE
Chr
ome
Fire
Fox
Safa
ri
Tier 1 Tier 2
OtherECMAScript 5
Online
SharePoint
SQL
Workflow
Autohosted
SQL
Web Sites
Clie
nt A
PIs Server
APIsO
ther
Dev
ices
& C
lient
s
3rd P
arty
Ser
vice
s
Development ToolsVisual Studio 2012, Napa or any standard Web development tool
ServerClient
Bro
wse
r Hos
t
Common App Architecture
Web Server H
ost
SharePoint JS (CSOM)
SharePoint&
Exchange
Server-side LogicAny language
APPProvider-hosted
Oth
erE.
g. L
AM
P
IIS /
ASP
.Net
Win
dow
sAzu
re
CSOM REST
On-premises
IE
Chr
ome
Fire
Fox
Safa
ri
Tier 1 Tier 2
OtherECMAScript 5
Online
SharePoint
SQL
Workflow
Autohosted
SQL
Web Sites
Clie
nt A
PIs Server
APIsO
ther
Dev
ices
& C
lient
s
3rd P
arty
Ser
vice
s
Office JS
Office
Web
App
s
Win
RT
Mac
Mob
ile
Win
32
Client-side LogicHTML / CSS / Javascript
Development ToolsVisual Studio 2012, Napa or any standard Web development tool
Parts of the App for Office
App
App ManifestWeb Page<XML>HTML/CSS/JS
Office Javascript API Overview
Document
Office.context
CustomXmlParts
Bindings
Settings
R/WSelection Selection
Mailbox
Properties & Settings
User Profile
EWS
Item
Project
Tasks
Project Info
Outlook App - Behind the scenes
Manifest deployed to ExchangeApp added manifest saved to user’s mailboxExchange 2013 is required for mail apps
Exchange Serverwith app manifests
Cloud Servicewith app HTML + JS
User running Outlook
Outlook loads Office JS libraryClicking on app tab loads the app’s HTML and JSApps must reference Office.js and use it to interact with Outlook
Outlook processes rules Outlook 2013 client loads all manifestsOutlook processes rules from manifest on the selected itemApps whose rules match are displayed as tabs
Possibilities…Activate on patternsBug trackingPackage trackingCase number/PO status look-up
Activate on entities or item classesNews link summaryPhone dialerWorkflow around a custom Exchange item class
Activate on all itemsCRMSocial (LinkedIn)Display information about recipients
“Comment a document” app
Still need a “cool” name
Comment options for a document•Word review
• SharePoint Versions• SharePoint Approve / reject
• 3rd party tools?
Solution?• Embed comments in document
• Comments stay in App Web (security)
• CSOM and/or REST + JavaScript
• Easy to create
Flow1. If new document, comments are not yet possible
2. If not new document, comments are possible1. Select reviewer2. Add comment message3. Click “add comment”
1. Comment is being saved in list2. Call is done to retrieve comments from list
How to build it
1. Add a document library
2. Create a document that contains an app for Office
3. Set the default content type for the document library to that document
App for SharePoint
Document Library
Document Template
App
Composable App Model
Document Library
App AppApp App
Document
App
App for SharePoint • App includes a
document library• Documents added to
the document library include an app for Office
• E.g. Comments app
End User Experience
Office Web Apps nowOffice Web AppsSharePoint
High FidelityFamiliarAvailable
EverywhereAdvanced Authoring
Working with Others
PCs/Macs PhonesTabletsSmart Phones
Lync File SharesInternal
Websites Exchange
Working with othersDocument
ReviewMulti-user Authoring
Meetings
Editing Excel Web App Presentation Broadcast
Change Tracking
Commenting
OneNote Web App
Word Web App
PowerPoint Web App
Lync Integration
Async Navigation
Media Playback
With anyone with a browser
Working with others now
Across devicesAcross devices NowPCs/Macs Tablets
Smart Phones
Phones
Editing
Viewing
IEFirefoxChromeSafari
WindowsiOS
WindowsiOSAndroid
Any browser-enabled phone
Editing
Device-optimized (touch, size)
?Question Answer
Take away• Learn Javascript + REST / CSOM
• Composable Apps are easy to build, just follow the correct steps