Cloud-Based App Development

Using SharePoint 2013, Office 365 and Azure

• Introducing the App Model• Complexity and Problems in

SharePoint• Why Apps?• What is the App Model?• Evolution of SharePoint

Customization Scenarios• Installation and App URL:s

Agenda

• App Architecture• The 3 Architectural Types• Choosing App Design

and Shapes• Design and Branding• App Scope• App Models• Installation

• Enterprise Architect working with SharePoint and Cloud Solutions• Microsoft Certified Trainer• SharePoint experience: 10 years, 15000+

hrs, >100 projects• Used SharePoint since SP2001, actively

specialized since SP2003 and up• BizTalk, Commerce, UAG, ISA, Navision,

AX, SQL…• MCPD, MCTP, MCITP (SharePoint

2003/2007/2010/2013)• V-TSP SharePoint Microsoft

Tobias Lekman

Introducing the App ModelCloud-Based App Development using SharePoint 2013, Office 365 and Azure

Complexity in SharePoint

• SharePoint is complex and contains many technical concepts and components

• Pages• Lists• Libraries• Sites• Views• Web Parts • Master Pages, site columns, index, etc etc…

What problems do we face today?

• Full-trust code customizations on the server (farm solutions)

• Main cause of outages• Large and complex deployments• Requires administrator access to servers• Not possible in shared hosting environments

• Sandbox• Possible in shared hosting environments• PoorAPI, poor performance and scalaility

• You need to be an expert on the SharePoint API in both scenarios

• Poor quality API

”This is the most significant change in SharePoint and Office in the last 15 years”  http://lek.mn/MHbIej 

What is the ”App Model”?

• No code is executed inside SharePoint or on the server• Not compatible with 2010 farm solutions• Apps get access rights to SharePoint via OAuth• Apps communicate with SharePoint via REST/CSOM• Install apps from a centralized marketplace• Corporate App Catalog• SharePoint Store (via submission process)• API for manual uploads (on-prem)

App Fundamentals

Apps are a fundamentally different approach to extending SharePoint functionality!• Built on scenarios

• Event Tracking• Process Management

• Robust• Built-in framework for installation, upgrade and uninstallation

• Apps are created with end users in mind• Cloud and web optimized

User Experience

• ”Everything is an App”• List of external contacts• Expense form• Shared Document Library

• ”View All Content” => ”Site Contents” shows all ”Apps”, e.g. functionality, lists and links to internal ”App Catalog” and ”SharePoint Store”

Evolution of SharePoint Customizations

SharePoint2007

SharePoint2010

SP 2013Services (IIS, Apache, etc, …)

Services (Azure, IIS, Apache, etc…)

Services(Azure, IIS, Apache,etc…)

SP2007 SP2010 SP2013

Declar. App & Workflow Events

Custom Code

Custom Code

CSOM

_vti_bin_vti_bin

_api

_api

CSOM

App Benefits

• No code on the server• Simplified upgrade of SharePoint (SP16)• Works in shared hosting environments

• Shortened learning roadmap• Isolation

• Private, public and hybrid cloud solutions

• Open for ALL web technologies, you can use .NET, Java, PHP as long as it’s web based• 24/7 deployments

ScenariosFull-Trust Sandbox Apps

Use Client-Side SharePoint API

Use Server-Side SharePoint API

Use Remote Services

App-based Permissions (OAuth2)

On-Premise Deployment Friendly

Hosted Deployment Friendly

Distribution via Marketplace

SharePoint Provided Schematics for Install / Upgrade / Uninstall

Scenario: App installed at http://intranet.contoso.com

http://tenant-APPUID.domain.com/APPNAME

http://app-bf473b5225nn0f.apps.contoso.com/SharePointAppTitle

APP-UID Unique ID

assigned to all apps

Each app domain is unique

APP-NAME Name of SPWeb

under where app is installed

Devs can control this

Installation and App URL:s

12/04/2023 15

Demo: Using SharePoint Store in Office 365Cloud-Based App Development using SharePoint 2013, Office 365 and Azure

12/04/2023 16

App ArchitectureCloud-Based App Development using SharePoint 2013, Office 365 and Azure

The 3 Architectural Types

App Web (from WSP)

Parent Web

SharePoint-Hosted App

Provision an isolated sub web on a parent web

• Reuse web elements (lists, files, out-of-box web parts)

• No server code allowed; use client JavaScript for logic, UX

Provider-Hosted App

“Bring your own server hosting infrastructure”

SharePoint Web

Get remote events from SharePoint Use CSOM/REST + OAuth to work with SP

Cloud-based Apps

Your Hosted Site

Autohosted App

Windows Azure + SQL Azure provisioned invisibly as apps are installed

Windows Azure

Websites

SharePoint Web

Val av app-design och formerShape Description Example

Full-page app The app creates a new scenario for the user

Process Management, Budgeting

“App Part” Creates app gadgets that can be added and controlled by the user

Weather, News Summary

“Extension App” Adds commands to documents and list items

Visualize documents, Send to offline printer

App-design and branding

• UX guide for SharePoint 2013 Apps• Alternative

• App template• ASPX page (hosted) in SharePoint• app.masterpage: includes AppWeb chrome• Default alternative from Visual Studio tooling

• Chrome control• Custom Chrome

• NOTE: Requires“Back to Site” link at top left corner

App Chrome Options

App Template

Chrome Control

Custom Chrome

• Web Scope• Register and use resources

from parent site (SPWeb, SPSite)

• Tenant Scope• Can register start page,

“custom actions” from Site Collection, Managed Path, Template Type

• (SharePoint-hosted tenant scope is not supported)

App Scope

12/04/2023 21

Demo: Creating SharePoint Hosted AppsCloud-Based App Development using SharePoint 2013, Office 365 and Azure

12/04/2023 22

App Model Type 1: SharePoint Hosted• Exists completely within SharePoint SPWeb• Use CAML declared SP components• Business logic executes on the client (jQuery, Knockout

etc)

App Model Type 2: Cloud Hosted

• Cloud hosted app mainly exists outside of SharePoint• Can utilize SharePoint components (libraries)• Communictes via CSOM / REST• Get access rights to SharePoint via OAuth

• Business logic is executed outside of SharePoint• On-prem web app in separate IIS• Windows Azure• Third party

Installation

• Install via PowerShell• Install in development site using Visual Studio• Install in SharePoint Store (via submission)• Install in App Catalog (internal corporate)

12/04/2023 25

Demo: Installing our AppCloud-Based App Development using SharePoint 2013, Office 365 and Azure

Introducing the App ModelComplexity and Problems in

SharePointWhy Apps?What is the App Model?Evolution of SharePoint

Customization ScenariosInstallation and App URL:s

Summary

App ArchitectureThe 3 Architectural TypesChoosing App Design

and ShapesDesign and BrandingApp ScopeApp ModelsInstallation

Further Info

• Create SharePoint 2013 development site on Office 365: http://msdn.microsoft.com/en-us/library/fp179924.aspx

• How to install a SharePoint App: http://lek.mn/VeKlHG

• Corporate News App: http://corporatenewsapp.codeplex.com

12/04/2023 28

Questions?

Thank you!