Introduction to AngularJS with the Microsoft Graph
Download as PPTX, PDF•0 likes•605 views
This document provides an introduction to integrating AngularJS applications with the Microsoft Graph. It begins with an overview of AngularJS and what it is used for. It then discusses the Microsoft Graph and Azure Active Directory, which enables single sign-on authentication for Office 365 services. It demonstrates how to scaffold an AngularJS app, enable authentication, connect to data sources, and secure routes when using the Microsoft Graph. It also shows how to incorporate the Office UI Fabric into AngularJS apps and make HTTP calls by injecting tokens. The presentation concludes with links to additional resources and a thank you from the presenter.
Introduction to AngularJS with the Microsoft Graph
- 1. Introduction to AngularJS with the Microsoft GraphSÉBASTIEN LEVERT PRODUCT OWNER, OCEANIK DEVELOPMENT & SOLUTIONS DIRECTOR, NEGOTIUM
- 2. SPONSORS
- 3. Who’s Sébastien Levert !? Montreal, Canada oceanik.com Office Servers & Services MVP Web Developer @sebastienlevert sebastienlevert.co m
- 4. Agenda • AngularJS • Microsoft Graph • Azure AD • Demos • Resources
- 5. ANGULARJS
- 6. What is AngularJS ? • Superheroic JavaScript MVW framework • Developed by Google • Started in 2009 • Used by Netflix, Youtube, Vevo, MSNBC, …, You ? • A game changer in web development • Angular 2.0 coming in 2015 2016
- 7. Why AngularJS ? • Getting closer to client-side development • Start thinking like a web developer, not like a SharePoint developer • Living on the edge • Building applications faster, with less code • Because everyone is heading towards it
- 8. AngularJS is (still) very… Trendy !
- 9. Key Concepts • Architecture pattern • Enhanced HTML templating • 2-way data-binding • Routing engine • Dependency injection • Unit testing
- 10. MICROSOFT GRAPH
- 11. Building integration with Office 365
- 12. AZURE AD
- 13. Single authentication flow for Office 365 • Sign 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 apps • Pin apps to Office 365 app launcher from My apps
- 14. Common consent • Single auth flow for accessing all O365 services • Admin and end-user consent • Secure protocol • OpenID Connect and OAuth 2.0 • No capturing user credentials • Fine-grained access scopes • Long-term access through refresh
- 15. Authentication Options • Azure AD only • Separate auth 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.)
- 16. ANGULARJS
- 17. What do we need to integrate? • Scaffolding of AngularJS application • Automatic authentication • Connecting data • Secured routes • Office UI Framework into AngularJS • Injection of tokens in HTTP calls
- 19. OFFICE HUB
- 20. MY MESSAGES
- 21. Resources • http://dev.office.com • http://ngofficeuifabric.com/ • http://github.com/sebastienlevert/officehub • http://slevert.me/slevert-twitter • http://slevert.me/slevert-slideshare • http://sebastienlevert.com