Every developer hears about AngularJS and all the magic it does for your 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 Office 365 API will be our main datasource. We will also cover SharePoint Online specific data access (Office 365 API, REST, CSOM and Search) to meet your current development needs. 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) and forms that will simplify your development process.

1. Introduction to AngularJS in an
Office 365 context
Sébastien Levert, Office Servers and Services MVP
Negotium Technologies, Montreal, Canada

2. Who’s Sébastien Levert ?
Montreal, Canada negotium.com
Office Servers &
Services MVP
Web Developer @sebastienlevert pimpthecloud.com

3. Agenda
AngularJS Office 365 Unified APISharePoint
Azure AD Authentication Wrap-UpDemos

4. What is AngularJS

5. What is AngularJS ?
Superheroic JavaScript
MVW framework
Started in 2009Developed by Google
Used by Netflix, Youtube,
Vevo, MSNBC, …
Angular 2.0 coming in
2015
A game changer in web
development

6. Why AngularJS ?
Getting closer to client-
side development
Living on the edge
Start thinking like a web
developer, not like a
SharePoint developer
Building applications
faster, with less code
It’s currently the hottest
development framework
Because everyone is
heading towards it, even
Microsoft

7. AngularJS is very… trendy

8. Key concepts
Architecture patterns 2-way data-binding
Enhanced HTML
templating
Routing engine Unit testingDependency injection

9. SharePoint Integration

10. Integrating AngularJS in a SharePoint Context
Multiple artifacts can act
as AngularJS apps
Runs in the context of
the user
Multiple data access
layers can be targeted
Available with SharePoint
2007, 2010, 2013,
Online…
Can be used in a
modern web
development workflow
Rapid development and
quick feedbacks

11. Demos

12. Office 365 Unified API

13. What is the Office 365 Unified API ?
Single API to consume
your Office 365 data
Exposed through the
Office Graph
Announced at //build
2015
Currently available in
preview through REST
and SDKs
Support of CORS (!!)In preview

14. Hands-on the Office 365 Unified API
Graph Explorer
graphexplorer2
.azurewebsites.net
Allows to run queries
against your own tenant
and explore the data
with OData queries

15. Azure AD
Authentication

16. What is the Office 365 Unified API ?
OAuth 2.0 Secured access scopes
Leaving the
authentication process to
Microsoft
Supports MFA &
federated authentication
Client credentials grant
flow
Perpetual connections
with refresh tokens

17. What is Azure AD Grant Flow ?
Azure AD
Client Application Office 365 API
1
2
3
4
Token
Resources
Token

18. How do I integrate Azure AD ?
Integrate on a single or
multiple tenants
Available for every major
platform
Use the Azure ADAL
libraries
Let the authentication
flow do the job, stop
coding login screens
It just works
Can be integrated with
the Identity Model of
.NET

19. Demos

20. Wrap-Up

21. Wrap-Up
AngularJS enables you to
write Single-Page
Applications integrated
with Office 365 &
SharePoint
Authentication is
possible thanks to Azure
AD Authentication
Library
All the Office 365 API are
being unified through
the Office Graph
AngularJS interceptors
can integrate the access
token with every API call
Stop worrying about
authentication and
security, start delivering
business value
Office 365 is the most
strategic developer
surface for Microsoft

22. References
dev.office.com
graphexplorer2
.azurewebsites.net
apisandbox.msdn.com
slevert.me/
espc15-blog
slevert.me/
espc15-slides
slevert.me/
espc15-office-hub

23. Questions ?