Visual Studio Team Serviceスモールスタート

2016/02/20

ComCamp2016 powered by MVP

保住 匡範

貞松 政史

保住 匡範@kiyokura

http://kiyokura.hateblo.jp/

住んでるところ大都会岡山

最近よく触ってるものTypeScript / knockout.js

AwardMicrosoft MVP for Visual Studio and Development Technologies

(2012.03 – 2016.03)

2

自己紹介

貞松 政史@sady_nitro

http://sadynitro.hatenablog.jp/

住んでるところ大都会岡山

最近よく触ってるものSQLServer

3

自己紹介

4

本資料並びにセッションでの発言は我々個人の調査や情報収集および実践に基づいて構成したものです

したがって所属企業やマイクロソフト等、私個人以外の如何なるものの意見を代表するものではありません

本セッションでの内容に起因して損害が生じた場合においても、発表者はその責任を負うことができません

免責事項

5

Visual Studio Team Services（VSTS）について

• 基本的な機能や使い方

• VSTSを小さく始める方法（実際の導入事例を交えて）

• 外部サービス連携やアドオン等の便利な拡張機能

セッション概要

6

• VSTSの概要

• VSTSを実際に導入した話

• 追加導入したい機能や拡張性について

• VSTS導入のメリットまとめ

• VSTSのネガティブ要素・課題

• セッションまとめ

アジェンダ

VSTS概要

7

VSTSの概要

VSTSとは？

•Team Foundation Server（TFS）のクラウドサービス

•定期的に最新のアップデートが適用される•TFSのアップデートを待たずして最新機能が利用できる•自分でメンテナンスしなくても良い•突然画面や機能の仕様が変わったりする

9

VSTSの概要

プロジェクト管理ツールである

•ソースコードのバージョン管理をホスティングしているものという位置づけではない•チームプロジェクト単位で運用する

チームプロジェクトコレクション

チームプロジェクトA チームプロジェクトB

タスク管理

ソース管理

…

タスク管理

ソース管理

…

10

VSTSの概要

統合的なプロジェクト管理

•非常に多機能•タスク管理•ソースコードのバージョン管理

•TeamFoundationバージョン管理（TFVC）or Git•Privateリポジトリ

•テストやバグのトラッキング•CI/CDツール

等々…

11

VSTSの概要

ライセンス体系（料金体系）

•5ユーザーまで無料で利用可能（Basicライセンス）•Visual Studio/MSDN サブスクリプション保有者は無償で利用可能（Basicライセンスを消費しない）•WorkItem（タスク管理）のみ利用のユーザー（ステークホルダー）は無料で利用可能•ビルドやリリース、ロードテスト等の追加機能について無料枠を超える場合は別途料金が発生

Visual Studio Team Services の価格https://www.visualstudio.com/ja-jp/products/visual-studio-team-services-pricing-vs.aspx

12

VSTSを導入する際にありがちなこと

VSTSを使ってみよう！

UIがすべて英語…

13

VSTSを導入する際にありがちなこと

で、VSTSは何ができるんだろう？

Visual Studio Team Services Get Startedhttps://www.visualstudio.com/get-started/overview-of-get-started-tasks-vs

14

VSTSを導入する際にありがちなこと

…

何から手を付ければいいのやら…

• タスク管理（Work）• イテレーション、スプリント• ユーザーストーリー、フィーチャー、バックログ、タスク• キャパシティ、ベロシティ• バーンアップ、バーンダウン

• ソース管理（Code）• Git or TFVC• コミットや変更セットとタスクとの関連付け• レビュー要求、Pull Request

• テストやバグのトラッキング（Test）• テストケース• バグトラッキング

• テストケースとバグの紐づけ• バグとコミットや変更セットの関連付け

• ロードテスト• CI/CDツール（Build, Release）

• ビルド構成(継続的インテグレーション, CI)• リリース構成(継続的デリバリー, CD)

15

VSTSを導入する際にありがちなこと

じゃあ、とりあえずソース管理リポジトリだけ使ってみよう！

チームプロジェクト？ プロセステンプレート？Agile? CMNI？ Scrum？

16

VSTSを導入する際にありがちなこと

Version ControlをGitでチームプロジェクトを作ったけど…

設定がよくわからない…

•リポジトリに接続するには…？•ユーザー(ライセンス)の設定は…？•権限の設定は…？•GitのCUIから接続したいんだけど…

17

本セッションのターゲット

VSTSをよく知らない方

前述の概要が軒並み初耳

VSTSを使ってみようと思って挫けてしまった方

前述のケースの様に（それ以外でも）使ってみようと思って何かしら挫けてしまった

18

• 実際に導入してみたユースケースをご紹介

• アジャイルに沿ってなくても大丈夫

• 全てを使いこなさなくても大丈夫

• ハマりそうな設定周りも解説

• VSTSを小さく始めてみましょう！

VSTSスモールスタート！

VSTSを実際に導入した話

19

20

•ソース管理リポジトリ（Git）

•タスク管理(Iteration, Sprint, Backlog, Task, Bug)

•Pull Request

•外部サービス連携（Service Hooks）

•ダッシュボード（ステータス, Wiki等）

至ってシンプル。

VSTSを実際に導入した話

実際に使用している機能

21

業務系システムの新規開発案件

ASP.NET MVCを採用したWebアプリケーション

とりあえずソース管理をVSTS（当時はVSO）上の

Gitでやってみようという話に

VSTSを実際に導入した話

導入の経緯

22

チームプロジェクトのソース管理に

Gitを選択

まず、モック作成用のリポジトリを作成

VSTSを実際に導入した話

ソース管理リポジトリ

Mock01

了解です

とりあえずこれで

23

Mockを幾つか作って壊してした後、プロジェクトの

本番リポジトリを作成

VSTSを実際に導入した話

ソース管理リポジトリ

Mock04 ProjectMasterMock01

…

24

Webアプリのリポジトリとは別でDBプロジェクトや

クライアントアプリバッチプログラム等々…

VSTSを実際に導入した話

ソース管理リポジトリ

ProjectMaster ProjectSql

ProjectClient ProjectBatch

追加料金なし！

25

プロセステンプレートはとりあえず「Scrum」を選択

• Iteration(Sprint)

•Feature

•Backlog

•Task

•Bug

VSTSを実際に導入した話

タスク管理（プロセステンプレート）

…

毎度よくわからんのです…

26

リリース単位でIterationを切ってみる

Iteration内のSprintは2週間を1単位として区切る

VSTSを実際に導入した話

タスク管理（Iteration）

27

現在のSprintに対してBacklog（要件）を列挙して

Taskに分解する

VSTSを実際に導入した話

タスク管理（Backlog, Task）

28

GitのコミットとTaskを紐付ける

VSのチームエクスプローラー上で

操作可能

VSTSを実際に導入した話

タスク管理（Task, Commit）

29

VSTSを実際に導入した話

タスク管理

Taskの画面からリンクされたコミットを確認できる

30

VSTSを実際に導入した話

タスク管理

カンバンボードでタスクを一覧

ドラッグ＆ドロップでアサインやステータスを変更できる

31

VSTSを実際に導入した話

ここまで使ってみて

•とりあえずプロジェクトのソース一式管理できる

•カンバンボードならユーザーベース、アイテムベースでタスクのステータスを一覧できる

•コミットとタスクが紐付いているので、ある要件がどのコミットで対応されたかトラッキングできる

カンバンボード最高！

32

VSTSを実際に導入した話

待望のPull Request機能追加！

ありがたやー！

Pull Request来ましたよ！

33

VSTSを実際に導入した話

Pull Requestが追加になって…

【追加前】

修正後に声掛け→ブランチをプルしてレビュー

→OKなら再度声掛け→手元でマージ・プッシュ

【追加後】

修正後にプルリク作成

→指定されたレビュアーがWeb画面上でコードレビュー

→OKならWeb画面上でマージ

34

VSTSを実際に導入した話

コードレビューのサイクルが文化的に！

…なったと思ったんですが

なんか惜しい。

見ますー

プルリク投げましたー

35

Pull Requestが作られたり、コミットがプッシュされたことに

気付かない…

何か通知を飛ばせる仕組みは無いだろうかと考える

VSTSを実際に導入した話

通知が欲しい…

36

VSTSビルトインのチームチャット機能

元々上位のライセンスでしか使えなかった

デスクトップ通知がない

ビルトインなだけあってVSTS内の

アイテムとリンクはし易い

VSTSを実際に導入した話

Team Room

他当たってみよう

37

外部のサービスと連携できる仕組み（Service Hooks）

なるものがあるらしい

VSTSを実際に導入した話

外部サービス連携（Service Hooks）

これで通知を飛ばしてみよう

38

連携可能なサービスとフックできる

イベントが色々ある模様

VSTSを実際に導入した話

外部サービス連携（Service Hooks）

39

HipChatと連携してみた

VSTSを実際に導入した話

外部サービス連携（Service Hooks）

40

VSTSを実際に導入した話

外部サービス連携（Service Hooks）

通知が飛ばせるようになった（デスクトップ通知も）

41

Slackに乗り換えてみた

VSTSを実際に導入した話

外部サービス連携（Service Hooks）

42

VSTSを実際に導入した話

外部サービス連携（Service Hooks）

情報が詳細かつ見易くなった

これでプルリクが捗る

43

カスタマイズ可能なダッシュボードの機能が追加に

元々のHome画面は非常にショボかったので

早速カスタマイズしてみることに

VSTSを実際に導入した話

ホーム画面が拡張

44

VSTSを実際に導入した話

ダッシュボード機能

タスクの状態やPull Requestの状況が一覧できる

45

VSTSを実際に導入した話

Markdownパネルが良さそう

Markdownパネルだけをひたすら並べたボードを一つ用意

Wikiページとして利用可能

46

VSTSを実際に導入した話

ここまで使ってみて

•Pull Request機能が追加になったことでコードレビューのサイクルが上手く回るようになった

•外部サービスと連携することでチーム内のレスポンスが良くなった

•ダッシュボード機能が追加になり、よりチームコラボレーションのツールとして使いやすくなった

プルリクと通知は無いと始まらない

47

• ユーザー管理について

• ユーザーとチームメンバーの違い- ユーザー

- VSTSのドメイン全体に属するユーザー

- チームメンバー

- ユーザーの内、あるチームプロジェクトに属するメンバー

VSTSを実際に導入した話

ハマりやすそうなポイント(1)

48

ユーザー管理

VSTSを実際に導入した話

ハマりやすそうなポイント(1)

49

ライセンスの種類や割り当てについて

VSTSを実際に導入した話

ハマりやすそうなポイント(1)

50

権限設定

権限付与の単位• ユーザー

• チームメンバー

• グループ

実際に使わせたい機能と権限の文言のわかりにくさ• コード閲覧はさせたい

• 特定のリポジトリの参照はさせたい

• リポジトリの編集(コミット・プッシュ)もさせたい

VSTSを実際に導入した話

ハマりやすそうなポイント(2)

51

権限設定

デザイナーさんにデザイン用のリポジトリを用意して

そこだけ参照・編集してもらおうとした

VSTSを実際に導入した話

ハマりやすそうなポイント(2)

準備しました！

見れないですねー

デザイナーさん

52

VSTSを実際に導入した話

ハマりやすそうなポイント(2)

Seculityタブ権限設定はココ

実はリポジトリに対する権限設定はVersionControlタブ

53

認証周り

GitのCUIからリポジトリを操作したい

Basic認証の設定

VSTSを実際に導入した話

ハマりやすそうなポイント(3)

54

認証周り

毎回認証を求められる(パスワード入力)が面倒…

Git Credential Managerの導入

VSTSを実際に導入した話

ハマりやすそうなポイント(3)

Git Credential Managerhttps://github.com/Microsoft/Git-Credential-Manager-for-Windows

55

VSTSを実際に導入した話

Git Credential Manager

56

Personal access tokens

2016のQ1でSSH認証が導入される予定

VSTSを実際に導入した話

認証に関するアップデート

追加導入したい機能や拡張性について

57

58

追加導入したい機能

ビルドツール

• 自動ビルドとユニットテストの定義

• ブランチに対するプッシュ毎に実行(CI)

59

• サービスフック

• Web API

• Extension

VSTSの拡張性

VSTSに用意されている拡張・外部連携の手段

60

• 複数のメジャーなサービスに対応

• 自作のサービスへの連携を組み込むことが可能• JSONでPOSTされるデータを受信できるWeb APIを

用意すればOK

• 言語や実行環境は問いません

• インターネットからアクセスできるWebサーバさえあれば

VSTSの拡張性

サービスフック - from VSTS to Other -

61

VSTSの拡張性

サービスフック - from VSTS to Other -

リファレンスはこのあたりから（英語）https://www.visualstudio.com/integrate/get-started/service-hooks/create-subscription

ASP.NET の場合、「ASP.NET WebHooks」というフレームワークが最近登場したのでそれを使うとさらに楽に作れるかも

Azure Web AppsとASP.NETでサクッと試してみた例http://kiyokura.hateblo.jp/entry/2014/12/24/223458

62

• Visual Studio Team Servicesの機能にREST APIを使ってアクセス可能

• 認証は OAuth 2.0 か BASIC認証• 現時点ではOAuthはWebアプリのみで利用可能

• 非WebアプリはBASIC認証のみ

• BASIC認証では利用できないAPIがある

• AccountsとProfiles

VSTSの拡張性

Web API - from Other to VSTS -

63

• リファレンスはそれなりにしっかりしてる感https://www.visualstudio.com/en-us/integrate/get-started/rest/basics

• 認証系の話も丁寧に書かれている（ただし英語）

• たどれるところにサンプルも

VSTSの拡張性

Web API - from Other to VSTS -

64

• VSTSにインストールできる拡張機能

• ギャラリーからインストール

https://marketplace.visualstudio.com/#VSTS

VSTSの拡張性

Extension - Add on VSTS -

65

• 自作可能• ドキュメントとサンプル

https://www.visualstudio.com/integrate/extensions/overview

• もちろん英語のみ

• チュートリアルやサンプルはそこそこ充実している

• ただしAPIリファレンスはまだ頼りない

• 何でもメールで気軽に聞いて！って書いてあるのでメールで聞きましょう（）

https://www.visualstudio.com/en-us/integrate/extensions/support/help

VSTSの拡張性

Extension - Add on VSTS -

VSTS導入のメリットまとめ

66

67

• 自力で面倒を見なくていいPrivateなソース管理リポジトリを手に入れた

• ザックリとイテレーションとスプリントを切ることで進捗が把握しやすくなった

VSTS導入のメリットまとめ

68

• バックログ、タスク、コミット、プルリクなどそれぞれが紐づいているので要件や作業ベースから変更を追いかけたり切り戻したりできるようになった

• 外部サービスによる通知機能で各自の作業状態を把握しやすくなりレスポンスも良くなった

VSTS導入のメリットまとめ

VSTSのネガティブ要素・課題

69

70

アクセスする人全員にライセンスが必要

ステークホルダーであれば無料でワークアイテムを参照できる

コードにアクセスする場合はBasic等のライセンスを

付与する必要がある

諸々事情を踏まえて結果的にRedmineと併用中

VSTSの不満な点・課題

71

OSSのプロジェクトで使いたい

→ソース管理リポジトリがPrivate、かつライセンスが

必要なので不特定多数に公開するのは困難

→GitHubやBitbucket使いましょう

VSTSの不満な点・課題

72

GitHubと同じことがやりたい

→GitHub使いましょう

VSTSの不満な点・課題

セッションまとめ

73

74

VSTSは非常に多機能なプロジェクト管理用クラウドサービス

必要な機能は一通り揃っていて、さらに拡張性もある

実際に導入してみた限り、全てを使いこなさなくても

メリットは得られる

VSTSが合わないケースもある

イイトコ取りしていけばいいと思う

セッションまとめ

75

Visual Studio Team Services

小さくはじめてみましょう！

セッションまとめ