ESPC15 - Introduction to AngularJS in an Office 365 context

•Download as PPTX, PDF•

1 like•664 views

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.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

ESPC15 - Introduction to AngularJS in an Office 365 context

In a world where we ear more and more about DevOps and continuous integration, your Office 365 integration process might be lacking some good practices and ways to automate everything. In this session, we will cover how you can use PowerShell to ease the deployment process of your applications, the monitoring of your tenants and the maintenance of all the workloads of Office 365. Being a demo-intensive session, be prepared to see a lot of PowerShell and Office 365 API code!

2013 - Back to the Future with Client/Server Development

Chris O'Connor

Developing SharePoint 2013 apps with Visual Studio 2012 - SharePoint Connecti...

Bram de Jager

The new SharePoint App Model provides different ways of building apps. As a developer you have to choose between development techniques, hosting options and more. This session discusses the architecture, various types of apps, application identity and permissions, and how to build these different types of apps. The session contains demos covering building SharePoint-hosted apps, implementing SharePoint 2013 chrome control, setting the right permissions, and more with Visual Studio 2012.

Building Push Triggers for Logic Apps

BizTalk360

This session will explore a mobile app that can read NFC tags embedded in conference badges, and then translate those to sales leads stored directly in popular SaaS CRM providers. To accomplish this, we will see how to build a custom Push Trigger API App for a Logic App, and then how to invoke a callback from a mobile device. We will also configure the Logic App to receive device events and provide integration with SaaS applications such as Salesforce. Once we have the basics established, we'll dip briefly into the world of Windows IoT to explore a push-button push trigger.

Developing hybrid SharePoint apps that run on-premise and in the cloud - ESPC...

Bram de Jager

With the new SharePoint App model running outside the SharePoint worker process it introduces new authentication models. As a developer you don't want to build multiple versions of the same app implementing each authentication model separately. This session explains the differences between securing SharePoint apps with OAuth in Office 365 and S2S High Trust in on-premise deployments. You will learn how to build a single app that will run on-premise, online and hybrid SharePoint environments. Attending the session provides in-depth insights into the authentication models for SharePoint Apps. After attending the session the developer is able to make a decision whether to implement SharePoint Apps as on-premise only, cloud only or "Hybrid" app that runs both on-premise and cloud.

SPConnect2014 Office 365 APIs

Wes Hackett

Collab365 - AngularJS & Office 365 Unified API : A match made in heaven!

Sébastien Levert

This session will give the developers, IT Pro and Business Analysts a new perspective of the new Office 365 APIs that are now available. The integration with the Office 365 platform has always been a big challenge and this session will show how we can leverage this integration into Line Of Business applications. We will also discuss how we can develop software practices that will help the software development teams to use technologies (Javascript, AngularJS, REST, CSOM, etc.) to achieve business goals. You will learn : what are the Office 365 APIs used for. why AngularJS is a time-saver technology for client-side development. when to use SharePoint CSOM vs. Office 365 APIs. why Azure Active Directory will become a central component of your Office 365 integration. how Office 365 APIs can help your team be more productive. Features Covered: the Office 365 APIs (Files, Contacts, Mails, Graph, etc.) the Azure Active Directory (for the Application registration process) the App Launcher the SharePoint-Hosted App Model the CSOM SharePoint API

Building Apps for SharePoint 2013 by Andrew Connell - SPTechCon

SPTechCon

Software as a Service applications have made significant inroads into the enterprise. By nature all of these applications are on islands until you can start to exchange data between them and the rest of your on premise line-of-business applications. Using the Microsoft Azure App Service platform, organizations can integrate their SaaS applications like SalesForce, Service Now and SharePoint online by creating hybrid interfaces in the cloud using Microsoft Azure. In this session, Kent will demonstrate how organizations use the agility and scalability of the cloud to build these interfaces in a very quick and secure manner.

Apps 101 - Moving to the SharePoint 2013 App Model - Presented 7/27/13 at Sha...

BlueMetalInc

Spca2014 office365 ap is full hackett obrienNCCOMMS

Connect the Impossible with Azure Logic App

François Boucher

O365Con18 - Hybrid SharePoint Deep Dive - Thomas Vochten

NCCOMMS

O365Con18 - Reach for the Cloud Build Solutions with the Power of Microsoft G...

NCCOMMS

Azure mobile apps

David Giard

Developer’s Independence Day:Introducing the SharePoint App Model

bgerman

Helsinki Serverless Meetup 15.6.2016 : AWS Services

Mikael Puittinen

O365Con18 - External Collaboration with Azure B2B - Sjoukje Zaal

NCCOMMS

Alon Fliess: APM – What Is It, and Why Do I Need It? - Architecture Next 20

CodeValue

So, you have a mature development process, and you also embrace DevOps. Your development team uses agile methodology. You use Git, and you have a continuous dev, test, and deployment process. But do you sleep well at night? Do you know that your services are up and running? That there are no availability, performance, and stability problems? Do you know if your customers are happy? The answer to all of those questions is precisely what APM systems provide. Application Performance Monitoring systems have become the IDE of the Site Reliability Engineers (SRE) and, as a matter of fact, for the all DevOps team, including the Dev part. In this session, you will get to know the essence of the APM systems, the good, the bad, and the vision about their future.

Introduction to AngularJS with the Microsoft Graph

SPC Adriatics

Azure: PaaS or IaaS

Shahed Chowdhuri

MVP Virtual Conference - Introduction to AngularJS in an Office 365 Context

Sébastien Levert

SPC Adriatics 2016 - Introduction to AngularJS with the Microsoft Graph

Sébastien Levert

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

What's hot

Tips and Tricks for Building Visual Studio Workflows

Malin De Silva

O365Con18 - Azure AD Connect Inside and Out - Sander Berkouwer

NCCOMMS

Connect SharePoint Framework solutions to APIs secured with Azure AD

BIWUG

SharePoint 2013 “App Model” Developing and Deploying Provider Hosted AppsSanjay Patel

O365Con18 - Introduction to Azure Web Applications - Eric Shupps

NCCOMMS

O365Con18 - PowerApps build custom forms for SharePoint with Azure Maps - Bra...

NCCOMMS

Logic apps and PowerApps - Integrate across your APIs

Sriram Hariharan

Integrating SaaS application using Microsoft’s Azure App Service Platform

BizTalk360

Apps 101 - Moving to the SharePoint 2013 App Model - Presented 7/27/13 at Sha...

BlueMetalInc

Spca2014 office365 ap is full hackett obrienNCCOMMS

Connect the Impossible with Azure Logic App

François Boucher

O365Con18 - Hybrid SharePoint Deep Dive - Thomas Vochten

NCCOMMS

O365Con18 - Reach for the Cloud Build Solutions with the Power of Microsoft G...

NCCOMMS

Azure mobile apps

David Giard

Developer’s Independence Day:Introducing the SharePoint App Model

bgerman

Helsinki Serverless Meetup 15.6.2016 : AWS Services

Mikael Puittinen

O365Con18 - External Collaboration with Azure B2B - Sjoukje Zaal

NCCOMMS

Alon Fliess: APM – What Is It, and Why Do I Need It? - Architecture Next 20

CodeValue

Introduction to AngularJS with the Microsoft Graph

SPC Adriatics

Azure: PaaS or IaaS

Shahed Chowdhuri

What's hot (20)

Tips and Tricks for Building Visual Studio Workflows

O365Con18 - Azure AD Connect Inside and Out - Sander Berkouwer

Connect SharePoint Framework solutions to APIs secured with Azure AD

SharePoint 2013 “App Model” Developing and Deploying Provider Hosted Apps

O365Con18 - Introduction to Azure Web Applications - Eric Shupps

O365Con18 - PowerApps build custom forms for SharePoint with Azure Maps - Bra...

Logic apps and PowerApps - Integrate across your APIs

Integrating SaaS application using Microsoft’s Azure App Service Platform

Apps 101 - Moving to the SharePoint 2013 App Model - Presented 7/27/13 at Sha...

Spca2014 office365 ap is full hackett obrien

Connect the Impossible with Azure Logic App

O365Con18 - Hybrid SharePoint Deep Dive - Thomas Vochten

O365Con18 - Reach for the Cloud Build Solutions with the Power of Microsoft G...

Azure mobile apps

Developer’s Independence Day:Introducing the SharePoint App Model

Helsinki Serverless Meetup 15.6.2016 : AWS Services

O365Con18 - External Collaboration with Azure B2B - Sjoukje Zaal

Alon Fliess: APM – What Is It, and Why Do I Need It? - Architecture Next 20

Introduction to AngularJS with the Microsoft Graph

Azure: PaaS or IaaS

Similar to ESPC15 - Introduction to AngularJS in an Office 365 context

MVP Virtual Conference - Introduction to AngularJS in an Office 365 Context

Sébastien Levert

SPC Adriatics 2016 - Introduction to AngularJS with the Microsoft Graph

Sébastien Levert

SPFestDc AZR204 Microsoft Graph and SharePoint Framework under steroids with ...

Vincent Biret

ATlink Forum - What's in the cloud for me?

Eran Stiller

Azure Active Directory - An Introduction for Developers

John Garland

Global Azure BootCamp: Azure Logic Apps

David Schneider

Azure from Rookie to DevStart

Sajeetharan

TechNet Conference 2013 Berlin-Wie Sie Office 365 mit Windows Azure steuern b...

atwork

Capture the Cloud with Azure

Shahed Chowdhuri

Office apps in Office 365 - Napa the next big thing

SPC Adriatics

Serverless Computing no Microsoft Azure

Igor Abade

Getting started with development in azure

Jasjit Chopra

Azure Mobile Services Workshop

Eran Stiller

http://stiller.co.il/blog/2015/10/azure-mobile-services-workshop-slide-deck-from-last-week/ Last week I had the pleasure of delivering a one day workshop at Microsoft Israel on Azure Mobile Services. For those of you who don't know, Azure Mobile Services is an Azure Platform-as-a-Service (PaaS) offering for easily authoring a mobile application back-end, complete with support for user authentication, push notifications and more. It is a type of service also commonly known as a Backend-as-a-Service. This is the slide deck for that workshop.

The App Evolution

Dev_Events

Overview of azure microservices and the impact on integration

BizTalk360

App Development Evolution: What has changed?

Paula Peña (She, Her, Hers)

EWUG 2018 February the journey continues.....

Peter Selch Dahl

"Secure Mobile Apps with the Microsoft Identity Platform", Christos Matskas, ...

Fwdays

If you ever had to deal with identity within your solutions then this is the session for you. Join JP and Christos to find out how to implement authentication and authorization for your mobile apps and back-end services using the Microsoft Identity platform. We will show you how to use our libraries to quickly connect to our platform and authenticate your users in a few, basic steps. Get ready for demos and examples the highlight how the Microsoft Identity Platform allows you to create scalable and secure applications.

Professional and expert share point consultancies near me

seoquixtec

Serverless API with Azure Functions

Analben Mehta

Similar to ESPC15 - Introduction to AngularJS in an Office 365 context (20)

MVP Virtual Conference - Introduction to AngularJS in an Office 365 Context

SPC Adriatics 2016 - Introduction to AngularJS with the Microsoft Graph

SPFestDc AZR204 Microsoft Graph and SharePoint Framework under steroids with ...

ATlink Forum - What's in the cloud for me?

Azure Active Directory - An Introduction for Developers

Global Azure BootCamp: Azure Logic Apps

Azure from Rookie to DevStart

TechNet Conference 2013 Berlin-Wie Sie Office 365 mit Windows Azure steuern b...

Capture the Cloud with Azure

Office apps in Office 365 - Napa the next big thing

Serverless Computing no Microsoft Azure

Getting started with development in azure

Azure Mobile Services Workshop

The App Evolution

Overview of azure microservices and the impact on integration

App Development Evolution: What has changed?

EWUG 2018 February the journey continues.....

"Secure Mobile Apps with the Microsoft Identity Platform", Christos Matskas, ...

Professional and expert share point consultancies near me

Serverless API with Azure Functions

More from Sébastien Levert

SharePoint Fest Chicago 2019 - Build a Full Intranet in 70 minutes

Sébastien Levert

SharePoint Fest Chicago 2019 - Building tailored search experiences in Modern...

Sébastien Levert

SharePoint Fest Chicago 2019 - From SharePoint to Office 365 Development

Sébastien Levert

ESPC19 - Supercharge Your Teams Experience with Advanced Development Techniques

Sébastien Levert

ESPC19 - Build Your First Microsoft Teams App Using SPFx

Sébastien Levert

SharePoint Fest Seattle 2019 - From SharePoint to Office 365 Development

Sébastien Levert

SharePoint Fest Seattle 2019 - Building tailored search experiences in Modern...

Sébastien Levert

SPC19 - Building tailored search experiences in Modern SharePoint

Sébastien Levert

SharePoint Fest 2019 - Build an intelligent application by connecting it to t...

Sébastien Levert

SharePoint Fest DC 2019 - Bot Framework and Microsoft Graph - Join The Revolu...

Sébastien Levert

SharePoint Fest DC 2019 - From SharePoint to Office 365 Development

Sébastien Levert

Webinar - 2020-03-24 - Build your first Microsoft Teams app using SPFx

Sébastien Levert

Congratulations! You’ve been working hard and you can now master the SharePoint Framework! How awesome would it be if the skills you developed could be reused in other emerging and bleeding-edge technologies? Like MS Teams? Your wishes just came true as it’s now absolutely possible to leverage the same SPFx toolchain to build great apps within Microsoft Teams! Come learn the basics of a Microsoft Teams App and how you can use the SharePoint Framework to build your next big application! Benefits of Attending this Webinar: -Get the roadmap to transfer your SPFx skills to Teams -Leverage a new integration opportunity in MS Teams -Understand how powerful SPFx is for multiple types of projects

SPTechCon Austin 2019 - Top 10 feature trends to make you fall in love with y...

Sébastien Levert

Do you feel like no one is currently using your intranet? Have you ever asked the question "Do you love you intranet" to your users? At Valo, we know your struggle and would love to help you out with the success of your internal communication portal. Join the 2 Microsoft MVPs and Valo Product Evangelists Vlad Catrinescu and Sébastien Levert on a journey to discover how you can leverage the top 10 feature trends of intranet platforms to finally have the successful intranet you've always been dreaming about!

SPTechCon Austin 2019 - From SharePoint to Office 365 development

Sébastien Levert

The world around the Office Developer is changing. And for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don't be scared, SharePoint Developer! Become an added-value Office Developer and contribute to maximize the productivity of your enterprise. The technology space around Productivity has evolved and it has never been that exciting. Your step into the Mobile-First, Cloud-First world will be mindblowing and you will want to stick around for a very long time! In this session, we will cover every aspect of the new Office 365 Developer paradigm and we will ensure that you can make yourself at home in such a new world. The technologies covered will span from being close to your existing stack (SharePoint Framework, JavaScript) to a set of technologies that are new and that will expand your possibilities (Office 365 Apps, Microsoft Graph, Azure, TypeScript) This very session will make sure that at the end you get those 3 key takeaways : - Understand your new role as an Office 365 Developer - Have a complete overview of the technology stack you need to master in the cloud - Change the way you will think for your next SharePoint & Office 365 project

SharePoint Fest Chicago 2018 - From SharePoint to Office 365 development

Sébastien Levert

The world around the Office Developer is changing. And for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don't be scared, SharePoint Developer! Become an added-value Office Developer and contribute to maximizing the productivity of your enterprise. The technology space around Productivity has evolved and it has never been that exciting. Your step into the Mobile-First, Cloud-First world will be mindblowing and you will want to stick around for a very long time! In this session, we will cover every aspect of the new Office 365 Developer paradigm and we will ensure that you can make yourself at home in such a new world. The technologies covered will span from being close to your existing stack (SharePoint Framework, JavaScript) to a set of technologies that are new and that will expand your possibilities (Office 365 Apps, Microsoft Graph, Azure, TypeScript) This very session will make sure that at the end you get those 3 key takeaways : - Understand your new role as an Office 365 Developer - Have a complete overview of the technology stack you need to master in the cloud - Change the way you will think for your next SharePoint & Office 365 project

SharePoint Saturday Vienna 2018 - Top 10 feature trends to make you fall in l...

Sébastien Levert

SharePoint Saturday Vienna 2018 - Building a modern intranet in 60 minutes

Sébastien Levert

European SharePoint Conference 2018 - Build an intelligent application by con...

Sébastien Levert

In this session, you will learn how to authenticate your users to the Microsoft Graph from a web perspective while enhancing your application by leveraging multiple endpoints (SharePoint, OneDrive & Exchange) available within this phenomenal API. You will also learn the basics of playing with the data, and then move to more advanced topics including ways to get notified of changes from webhooks, get subset of results using built-in paging mechanisms and finally how to track the ever-changing data that lives in the Microsoft Graph.

SharePoint Saturday Belgium 2018 - APIs, APIs everywhere!

Sébastien Levert

Using the SharePoint Framework as a surface to express yourself through client side solutions is great but at some point in time, you will require that this beauty you built interacts with APIs holding data that lives within the Office 365 environment. In this session, you will learn how to utilize and optimize your calls to SharePoint via its REST APIs, to the Microsoft Graph and to external services that you might find useful to deliver a rich experience in your solution. You will also learn about how to simplify those calls using the Community-Driven library PnP JS Core that aims to save your time (and sanity) by simplifying the access to the SharePoint REST APIs and to the Microsoft Graph. Goodbye URLs, hello intellisense!

Nashville SharePoint User Group 2018 - Building a modern intranet in 60 minutes

Sébastien Levert

More from Sébastien Levert (20)