2020年9月度の.NETラボ勉強会資料です。 https://dotnetlab.connpass.com/event/186236/

1. Microsoft Teamsカスタマイズ入門

2. 今回話す内容
• Teamsカスタマイズの種類
• 自分で開発してTeamsに機能を追加する方法
• その他MS製品の活用とかストアのアプリ紹介で
はないです

3. ゴール
• Teamsをカスタマイズする手段を知る
• それぞれの手段を簡単に解説

4. カスタマイズの方法

5. • Teamsクライアントにインストール
（今回のメイン）
• APIを操作（Teamsから or Teamsに対して）
カスタマイズの方法は大きく2つ

6. • 直接アップロード
• 組織内で配布
• App Storeから配布
クライアントにインストール

7. • タブ
• ボット
• メッセージング拡張
クライアントにインストール

8. • Webhookとコネクタ
• Teams Graph REST API
APIを操作

9. インストール

10. インストール型
• App Studio
• Bot Frameworkを使う場合はローカル不可（トンネリ
ングなどを利用）
• マニフェストとアイコン画像をアップロード
• 基本はWebアプリケーション

11. App Studio
• ストアを経由せずにインストール
• マニフェストエディタ機能
• Microsoft 365の管理センターで要許可

12. マニフェストファイル
• アプリケーションの機能などを定義
• JSON形式
• 実際のロジックは通信先のWebアプリケーション

13. Botフレームワーク
• 対話型のアプリケーション
• ボット機能やメッセージング拡張で利用

14. 開発補助
• VS Code用「Microsoft Teams Toolkit」
• VS用「Microsoft Teams App」
https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.vsteamstemplate
https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension

15. タブ

16. • Teamsクライアントのタブとして表示
• 個人タブ・チャネル / グループタブ
• 仕組みはiframe
• JavaScriptでTeams側の情報を取得
タブ機能

17. • Teamsクライアントのデータを扱うためのLibrary
Microsoft Teams JavaScript Libraryhttps://www.npmjs.com/package/@microsoft/teams-js

18. • F12開発者ツール的なやつ
Dev Tools

19. DEMO(時間があれば)

20. DEMO(時間があれば)

21. DEMO(時間があれば)

22. ボット

23. • アプリケーションと対話的にやり取りを行う
• @メンションを送るとリアクションが返ってくる
• 応答はテキスト・カード・タスクモジュールなどの表
現形式を組み合わせる
• エンドポイントにアクセス
（デフォルトは/api/messages）
ボット

24. • カードを使えば画像や複数のテキストを組み合わ
せて表示可能
• タスクモジュールはフォームなどを表示可能
カード・タスクモジュール

25. • botはlocalhostでは使用できない
• ngrokなどのトンネリングを利用
• またはクラウドやレンタルサーバーを利用
トンネリング
https://ngrok.com/

26. DEMO(時間があれば)

27. DEMO(時間があれば)

28. DEMO(時間があれば)

29. メッセージング拡張

30. • フォームやボタンの機能を追加
• Botフレームワークを利用
• 検索拡張・アクション拡張
メッセージング拡張

31. DEMO(時間があれば)

32. 非インストール

33. 非インストール型
• Webhookとコネクタ
• REST API

34. Webhookとコネクタ
• Outgoing webhook
• コネクタ（Incoming webhook・Office365コネクタ
など）
• シンプルな呼び出しを簡単に作成

35. DEMO(時間があれば)

36. DEMO(時間があれば)

37. DEMO(時間があれば)

38. DEMO(時間があれば)

39. DEMO(時間があれば)

40. DEMO(時間があれば)

41. REST API
• Microsoft Graph
• REST APIでOffice365のデータを操作
• Microsoftのサンプルで色々わかる
https://github.com/microsoftgraph/csharp-teams-sample-graph

42. DEMO(時間があれば)

43. DEMO(時間があれば)

44. もうちょっと詳しく！
• LinkedInラーニングにて動画公開(予定)

45. ご静聴ありがとうございました