Every developer hears about AngularJS and all the magic it does for you applications. In order to kickstart you AngularJS journey, this session is an introduction to the AngularJS concepts applied to any Office 365 development. Different workloads will be targeted (Mail, Calendar, Files) and the Microsoft Graph will be our main datasource. As a developer, you will learn the basic concepts of AngularJS and will be able to use those in an Office 365 context. You will be able to build rich applications (Single Page Application) that will speed up your development process while using your Office 365 tenant data. The 3 key takeaways of this session are : - You will understand the basics of the AngularJS framework - You will learn how to communicate withthe Office 365 through AngularJS - You will be able to apply those new skills in your next project

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

18. DEMOS, DEMOS EVERYWHERE!

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

22. thank you
questions?
live ratings
HTTP://WWW.SEBASTIENLEVERT.COM@SEBASTIENLEVERT
spca.biz/KVU9