1. 23/04/2017
Desarrollando una integración entre Azure Websites y SharePoint Online de Office 365

3. ING. ANDRES FELIPE ROJAS
MVP SHAREPOINT SERVER
@arojaspa
arojaspa
@sharecol

4. Agenda Getting starter Configuring a DEV Environment App Types
DEMO: SharePoint Online and Azure Web Sites better together.

5. Getting starter

6. What is in it for developers?
Same code works in cloud and in on-premises
Build market place apps and reach all Office 365 customers easily
More flexible model with additional possibilities
Standard .NET development tooling
Let’s take a moment and, in a brief glimpse, look at what is in store for developers for Office and Office 365 development.

7. Developer template and usage
Microsoft Office
4/23/2017
Enables remote development against the SharePoint farm
Also with on-premises deployments
Microsoft created a new type of site collection template that developers can use when developing and testing apps. This new type of site, a Developer Site Collection, allows developers to install and attach a debugger to the app straight from Visual Studio.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

8. Developer sites and remote development
Microsoft SharePoint Server 2013
Developer sites and remote development 2 1 3 1 4
Clients using remote development tools
Preferred option is to use Office365 – you can share even the same instance cross your App developers
You can also host your SharePoint Windows Azure IaaS server – so that development occurs against that instance
Just as for IaaS, you can do development against shared on-premises instance – most likely you’d dedicate site collection per developer for testing usage
TFS – could be on-premises, hosted in IaaS platform or used as service from cloud 1
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

9. App shapes for SharePoint
Tech Ready 15
4/23/2017
UI command extensions
Add new commands to the ribbon and item menus
Full page
Implement complete app experiences to satisfy
business scenarios
Parts
Create app parts that can interact with the SharePoint experience
The new SharePoint App Model gives developers three different ways to surface their app customizations within SharePoint sites.
The first option, a full page, is required for all apps. Think of this as the immersive experience where you can create an app that takes over the entire screen.
Even if your app is designed to only use the App Part or UI command extension options (both explained in a moment), you must still have a full page implementation. However this can simply be an “about me” or FAQ style page for your app customizations.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

10. SPC Developer
4/23/2017
This is an example of what the full page immersive experience would look like. Notice the traditional SharePoint experience is missing… all we see is a familiar SharePoint app bar at the top, but everything else is custom.
Microsoft does provide some controls & tools to ingest the parent site’s styles so that your app can have a similar look & feel as the parent site.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

11. App shapes for SharePoint
Tech Ready 15
4/23/2017
UI command extensions
Add new commands to the ribbon and item menus
Full page
Implement complete app experiences to satisfy business scenarios
Parts
Create app parts that can interact with the SharePoint experience
Another option for surfacing your customizations are app parts. To the end user, these look and act very much like web parts. However the content is rendered by your app that resides either in SharePoint or some remote location.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

12. SPC Developer
4/23/2017
Here is an example of an app part. Notice adding it to the existing page is very similar to adding a web part. When it’s rendered, it looks like a standard web part, as in the screenshot showing the weather for Reston, Virginia… except that content is actually coming from the app.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

13. App shapes for SharePoint
Tech Ready 15
App shapes for SharePoint
4/23/2017
Full page
Implement complete app experiences to satisfy business scenarios
Parts
Create app parts that can interact with the SharePoint experience
UI command extensions
Add new commands to the ribbon and item menus
The final type of customization is a UI command extension. This can be implemented as a custom menu item in lists and libraries or as a new button or tab on in the ribbon.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

14. SPC Developer
4/23/2017
Here is an example of a command UI extension. You see that this app has created a new tab in the ribbon called TIMELINE that contains it’s own tab groups and controls to interact with the page.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

15. Configuring a DEV environment

16. Apps for SharePoint Dev Environment
Microsoft Office
Apps for SharePoint Dev Environment
4/23/2017
Office 365 Developer Site Collection
Windows Azure Subscription (not obligatory, but useable for AD)
Visual Studio 2013
Visual Studio 2015
Office Developer Tools for Visual Studio 2013 (not obligatory, but useable for Office 365 development)
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

17. Setting up Environments
Microsoft Office
Setting up Environments
4/23/2017
Sign up for an Office 365 subscription
Create a Developer Site Collection
Sign up for Windows Azure subscription
Link Office 365 AAD to Windows Azure (not obligatory)
Make Office 365 user administrator in Windows Azure (not obligatory)
Use Visual Studio remotely to develop
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

18. Developer Site Collection
Microsoft Office
4/23/2017
Required for remote app development
Created automatically if you sign up for an Office 365 Developer Site
Use the Developer Site template to create a new Site Collection in an existing tenancy
An Office 365 Developer Site makes it easier to get set up and start creating, testing, and deploying your apps for Office and SharePoint more quickly. Office 365 enterprise (E3 or E4) subscriptions include a site template you can use to create a Developer Site.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

19. App Catalog Required to publish apps
Microsoft Office
4/23/2017
Required to publish apps
Create in the SharePoint Admin Center Apps/App Catalog
As a SharePoint Online admin, you can create an App Catalog site to make internally developed custom apps available for users to install when they browse apps under the From Your Organization filter on the Site Contents page. Site owners can then add these apps to customize sites with specific functionality or to display information.
After an App Catalog site has been created, you can use it to upload any custom apps that your organization has developed. Uploading custom apps is not much more complicated than uploading a document to a library and setting some properties. You can also use the App Catalog site to do things like install custom or third-party apps on sites for users (also called app deployment). You can also manage app requests from users.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

20. Visual Studio 2013 / 2015 90-Day Trial VS 2013 RC VS 2015
RC VS 2015

21. Link Office 365 and Azure (Not Obligatory)
Microsoft Office
4/23/2017
(Not Obligatory)
Log into Microsoft Azure subscription as administrator
Click on the Active Directory link.
Click New>Active Directory>Directory>Custom Create
Select to Add an Existing Directory
Follow the steps to add an existing directory
It’s not required to link the Office 365 Directory to an Azure subscription
for simply creating provider-hosted apps, but it makes life a bit easier
and opens up the ability to call into Office 365 from other applications.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

22. Office 365 Account as Azure Admin
Microsoft Office
4/23/2017
Log into an existing Microsoft Azure as administrator
Click the Settings link
Click Administrators
Click Add
Add the Organizational Account from Office 365
By adding an Office 365 account as an Azure administrator,
you can use a single account for managing both subscriptions
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

23. Seller Dashboard Overview
Microsoft Office
4/23/2017
Required to submit apps to Microsoft marketplaces
Apps for SharePoint
Apps for Office
Windows 8.1
Azure Marketplace
May be company or individual
If you are a software developer who creates apps that support or enhance Microsoft technologies, such as Microsoft SharePoint, Microsoft Office, and Azure, you can use the Seller Dashboard to submit and distribute your apps to Microsoft marketplaces.
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

24. Seller Dashboard Sign Up Process
Obtain a Microsoft account, if you do not have one
Sign into the Seller Dashboard with your Microsoft Account
Fill in the registration information
Submit for approval

25. Seller Dashboard Publishing Process
Build the app
Upload app to your Seller Dashboard account
Submit app for approval
See app in the marketplace
Track app usage and receive payout

26. App for SharePoint – Provider types
Tech Ready 15
4/23/2017
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

27. Architecture (SharePoint-Hosted Apps [OnPrem+365])
Microsoft Office
4/23/2017
SharePoint (OnPrem/365)
Host Web
ACS
SubSPWeb + AppWeb
-SubWeb under HostWeb
-Separate Domain
-Created during App Installation
App Web is a sub web under the host web
App web is a separate domain
App web is created during app installation process
App web contains pages and other declarative SharePoint artifacts
App web is limited to JavaScript
App web can access host web as long as it has appropriate permissions
May call to other cross-domain resources using appropriate techniques such as cross-origin resource sharing (CORS) or a web proxy
ACS (Access Control Service):
- OnPrem: SharePoint
- 365: AACS
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

28. Architecture (Provider-Hosted Apps [OnPrem+365])
Microsoft Office
Architecture (Provider-Hosted Apps [OnPrem+365])
4/23/2017
SharePoint (OnPrem/365)
Host Web
ACS
SubSPWeb
-SubWeb under HostWeb
-Separate Domain
-Created during App Installation
App Web is a sub web under the host web
App web is a separate domain
App web is created during app installation process
App web contains pages and other declarative SharePoint artifacts
App web is limited to JavaScript
App web can access host web as long as it has appropriate permissions
May call to other cross-domain resources using appropriate techniques such as cross-origin resource sharing (CORS) or a web proxy
Provider
AppWeb
ACS (Access Control Service):
- S2S (certificado)
- AACS
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

29. Demo
SharePoint online and azure web sites better together.