devteach 2016 - introduction to angularjs in an office 365 context

18
INTRODUCTION TO ANGULARJS IN AN OFFICE 365 CONTEXT Sébastien Levert Development Lead @ 2toLead @sebastienlevert

Upload: sebastien-levert

Post on 14-Apr-2017

252 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

INTRODUCTION TO ANGULARJS IN AN

OFFICE 365 CONTEXTSébastien LevertDevelopment Lead @ 2toLead@sebastienlevert

Page 2: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

WHO’S SÉBASTIEN LEVERT ?!

Montreal, Canada

www.2toLead.com

Office Servers & Services MVP

Web Developer@sebastienlever

tsebastienlevert.c

om

Page 3: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

AGENDAWhy Office 365 ?What is the Microsoft Graph ?What are Azure AD Application ?DemosResources

Page 4: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

WHY OFFICE 365 ?

Page 5: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

OPPORTUNITY Over 4

trillion emails sent with O365

100+ million downloads of mobile apps

850 million

meetings are created a month

2–3 hours/day

spent in Office add-ins1.2

billion+ users

470+ PB

of storage

Page 6: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

OFFICE ADD-INSContextual mail add-in Add-in launched contextually from a mail message or appointment Outlook and Outlook Web Access (OWA)

Task pane add-in Add-in that runs beside a document/mail with read/write access Word, Excel, PowerPoint, Project, Outlook

Content add-in Add-in that runs within a document content with read/write access Excel, PowerPoint, Access

Add-in command Command in the Office UI to launch add-in or perform UI-less operation

Outlook, Outlook Web Access (OWA)

Page 7: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

OPEN PLATFORMAzure AD and Office 365 offer Libraries/SDKs, but they are not mandatory as the platform is building on web standards such as OAuth2, REST, and OData

ADAL Library ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔Office 365 SDK ✔ ✔ ✔ ✔ ✔ ✔ ✔Dev.office.com samples ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔

Page 8: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

WHAT IS THE MICROSOFT GRAPH ?

Page 9: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

WHAT IS THE MICROSOFT GRAPHSingle endpoint for:Accessing data

/me, /users, /groups, /messages, /drive, ….

Traversing data/drive/<id>/lastmodifiedByUser

Accessing insights/insights/trending

Work/School and Personal

https://graph.microsoft.com/

Page 10: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

BUILDING INTEGRATION WITH OFFICE 365 Use your favorite technology and host it anywhere

Code in your favorite IDE

Use standards to connect to your data

Get data, insights and relationships from the Office Graph

Page 11: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

WHAT ARE AZURE AD APPLICATIONS ?

Page 12: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

SINGLE AUTHENTICATION FLOW FOR OFFICE 365Sign users in using OpenID Connect Azure AD and Office 365 services Supports MFA and federated user sign-in

Device apps, web sites, SPAs, and service appsPin apps to Office 365 app launcher from My apps

Page 13: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

COMMON CONSENTAdmin and end-user consentSecure protocol OpenID Connect and OAuth 2.0 No capturing user credentials Fine-grained access scopes Long-term access through refresh tokens

Page 14: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

AUTHENTICATION OPTIONSAzure AD only Separate authentication flow supports Azure AD accounts only

Azure AD and Microsoft Accounts (Preview) Converged auth flow supports Azure AD accounts and Microsoft accounts (LiveID - hotmail.com, etc.)

Page 15: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

DEMOS

Page 16: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

RESOURCES

Page 17: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

RESOURCEShttps://dev.office.comhttps://graph.microsoft.iohttp://github.com/officedevhttp://github.com/microsoftgraphhttp://github.com/sebastienleverthttps://github.com/maliksahilhttps://github.com/richdizz

Page 18: DevTeach 2016 - Introduction to AngularJS in an Office 365 Context

QUESTIONS ? COMMENTS ?