SharePoint hosted Apps with "Napa" & Visual Studio 2012

As discussed in the post earlier, SharePoint 2013 allows you to write Apps which can extend the functionalities your SharePoint website provides. Primarily an App can be divided into two categories depending upon where its components reside:

1. SharePoint hosted App – Major pieces of an App are on SharePoint server with business logic and presentational pieces in form of JavaScript/CSOM and HTML executed at the client respectively executed on the client. Please note that such App doesn’t run any custom code on SharePoint server
2. Cloud hosted App – Some or all of business logic and presentation reside in cloud or on premise server different from the SharePoint server. The custom code doesn’t have to be in SharePoint or .Net, it could be anything that can be consumed through common web standards.

In this post, I am going to solely focus on how start building a SharePoint hosted app while internals of cloud hosted apps that require understanding complex multi-party authorization will be covered in subsequent posts.

Development tools that you need for building SharePoint hosted apps: “Napa” Office 365 development tools,

• If you are developing an app targeted for Office 365 environment, you don’t need to download anything on your development machine not even Visual Studio. In fact, all you need is just a standard browser and “Napa” Office 365 development tools which requires a subscription to Office 365, free during SharePoint 2013 preview. “Napa” provides you a web-based interface to author, test and deploy your Apps.

 

• If you find “Napa” web tools limiting, you may download a Visual Studio 2012 and install on your development machine followed by installation of Office Developer Tools and SharePoint client components. Visual studio allows you build your app locally and then deploy and test on Office 365 developer site. Office 365 provisions a separate web site solely for deploying and testing called developer site. You aren’t allowed to deploy your app to any other site in Office 365.

Alternatively, you may build your own development environment that hosts SharePoint 2013 preview and Visual Studio 2012 preview and other necessary prerequisites. You must also configure isolated app domain for your App (discussed below). Find more details on installation here.  

Scope and Isolated App domain: When App is installed, a separate site(SPWeb) called AppWeb is created within the hosting site often referred to as Host web. An App can be scoped at web level or tenant level. Unlike Cloud hosted apps, SharePoint doesn’t support tenant scoped apps which may contain data for multiple tenants so SharePoint hosted Apps are always scoped at web level and cannot exchange information with other apps. AppWeb has a unique address which in turn uniquely identifies an App.     When App is launched, observe the long URL in the address bar. First thing between two forward slashes and a hyphen is the tenant name when the site was provisioned. 14 digit unique identifier before the domain name (in Office 365, an address always ends with sharepoint.com) which identifies the app installation in that tenancy and make App domain unique. The content in green box is the name of the SPWeb where the app is installed. Deploying an app in isolated domain helps

• Blocking cross site scripting attacks
• Enforcing App permissions when App talks back to SharePoint using CSOM.

When using Office 365, you don’t need to worry about configuring App isolation domain as it’s already configured for you when the instance was provisioned. In next post, we will walk through series of steps to create SharePoint hosted apps using Napa and Visual Studio 2012.