Office 365 development overview: Why Office 365 development Office 365 Developer Program Ways to develop Office 365 Apps/Integration Registering Office 365 Application Tools for Office 365 development

1. OFFICE 365 DEVELOPMENT
OVERVIEW
Nilesh Shah
Tech Lead, RN Design Ltd.
@NileshR_Shah www.nilesh.live
C# CORNER – TORONTO CHAPTER

2. ▪ Chapter is a local user group where
members share technical
knowledge by hosting monthly
meetups, workshops and webinars.
▪ 33 chapters worldwide
▪ 2 chapters in Canada
▪ Regina, SK
▪ Toronto
2

3. ▪ Theme:
▪ Make developers aware of the different Office 365 development
options
▪ Set stage for future deep dive sessions
3

4. ▪ Introduction:
▪ Why,What, How
▪ Office 365 Add-ins development
▪ Office UI Fabric
▪ Microsoft Graph API development
▪ MS Graph Explorer
▪ Office 365 Developer program
▪ Register Office 365 Application
▪ Demo
4

5. 5

6. ▪ Office 365 Add-in development
▪ Word, Excel, PowerPoint, Outlook
▪ MS Graph API
▪ Office 365 APIs
▪ SharePoint Online
▪ Others:
▪ MS Teams
▪ MS Flow
▪ OneNote
▪ Yammer
6

7. ▪ Visual Studio 2015
▪ Apps for Office
▪ Visual Studio 2017
▪ O365 Add-in (not theVSTO add-in)
▪ Yeoman Office Project generator
▪ Generates Office Add-in skeleton
▪ Use any editor of your choice
▪ Visual Studio Code
7

8. ▪ Add-ins run inside an Office application
▪ Interact with the contents of the Office document
▪ Provide extra functionality
▪ It’s a web app integrated in Office application
▪ Use rich JavaScript API
▪ No separate installation needed
▪ Consists of manifest and web app code
8

9. ▪ Extend Office functionality
▪ Provide productivity enhancements
▪ Maps, charts, and interactive visualizations, etc.
▪ Integrate widely used third party functionality
▪ Salesforce, MS Dynamics, QuickBooks
▪ Bring external data into Office
▪ Connect to MS Graph API/Other third party APIs
▪ Sell your add-in on most widely used platform
▪ Must meet Office Store validation policies
▪ Or host on your own
9

10. 10

11. ▪ Pre-Office 2013
▪ Office 365/2013/2016
11
Macro
Extending
Ribbon
Add-in
(COM/VSTO)
Macro
Extending
Ribbon
Add-in
(COM/VSTO)
Office 365
Add-in
SharePoint
Add-in
Document
template

12. ▪ Manifest: defines the metadata about an add-in
▪ Name Description Version
▪ Publisher Permissions etc.
▪ Web app:
▪ consists of actual code (Web page + JS)
12

13. 13

14. ▪ Unified development
▪ Same code can run in Office 2013/2016(Desktop App), Mobile app
or Office 365 (Online)
▪ Choice of platform – JS, Angular, React,VueJS, ..
▪ Ready building blocks
▪ Visual Studio project templates
▪ Office project generator (Yeoman)
▪ Office UI framework
14

15. ▪ Official UX design framework for Office Add-ins
▪ Designed explicitly for Office development
▪ Based on Office best practices
▪ Responsive, Mobile first
▪ Seamless UX design & integration
▪ Same look and feel as Office clients
▪ Suitable for all platforms
▪ Offers a variety of UI elements
▪ Icons Fonts UI Components like buttons
▪ Available as:
▪ Fabric JS, Fabric React, Fabric AngularJS
15

16. ▪ Test run:
▪ From VS *
▪ Side loading *
▪ Internal to your organization:
▪ Centralized deployment (O365 admin center)
▪ SharePoint Add-in catalog
▪ Exchange server (for Outlook add-ins only)
▪ Network share *
▪ Public/Commercial:
▪ AppSource (Office Store)
▪ Must conform to MS Office validation policies
16

17. ▪ https://developer.microsoft.com/en-us/store/register
17

18. ▪ VS 2015
▪ VSTO Add-in
▪ Apps for Office
▪ VS 2017
▪ Office 365 Add-in
▪ Yeoman Office Add-in Project Generator
▪ YO OFFICE
18

19. ▪ https://dev.office.com/
▪ Office 365 Dev center on GitHub
▪ https://github.com/officedev
▪ YO Office
▪ https://github.com/officedev/generator-office
▪ Office 365 for Developers Courses
▪ https://mva.microsoft.com/product-training/office-development
▪ Office 365 Developer program
▪ https://dev.office.com/devprogram
▪ My blogs:
▪ https://nilesh.live/blogs/office365/
19

20. ▪ Integrate Office 365 data in your application
▪ Individual APIs:
▪ OneDrive
▪ Outlook
▪ OneNote
▪ …
20

21. 21

22. 22
https://graph.microsoft.com/

23. ▪ REST API to interact with data from Office 365
▪ Single endpoint to access everything
23

24. ▪ Single well-known resource
▪ Get (mostly) everything from a single endpoint
▪ Users, Groups, Mail, Calendars, Contacts
▪ Files,Tasks, People, Notes and more…
▪ Ease of development
▪ No calling different endpoints
▪ No separate token management
▪ Logical Navigation
▪ Platform flexibility
▪ Open standards
▪ REST, JSON, OAUTH, ODATA
24

25. 25

26. 26

27. 27

28. ▪ https://graph.microsoft.com/{version}/{resource}?[query_para
meters]
▪ https://graph.microsoft.com = Microsoft Graph API endpoint
▪ Version = v1.0 or beta
▪ Resource = segment or path
▪ user, group, event, etc.
▪ Alias: me (logged in user), organization
▪ query_parameters (Optional) = $top, $count, etc.
28

29. 29
$top – specific no. of items
$skip – skip items in result
$count – how many items
$select – specific property
$orderby – sort the result
$search – match a criteria
$expand – include child objects

30. ▪ MS Graph API Explorer
▪ MS Graph SDK
▪ MS App Registration Portal
30

31. ▪ Everything in Graph
▪ https://developer.microsoft.com/en-us/graph
▪ Graph Explorer
▪ https://developer.microsoft.com/en-us/graph/graph-explorer
▪ MS Graph on GitHub
▪ https://github.com/microsoftgraph
▪ My blogs:
▪ https://nilesh.live/blogs/msgraph/
31

32. 32

33. 33
@NileshR_Shah
/nileshshah9
www.nilesh.live
Sharing is Caring!