ASP.NET WebアプリケーションのALM(アプリケーション・ライフサイクル・マネジメント) part.2 #aspnetjp #dotnetjp #tfsug

前回まで

前回はソリューションの作成(実装)として、ソース管理、ソース同期まで記載した。今回はその続きとして、Windows Azure Webサイトの作成以降を記載する。

Windows Azure Webサイトの作成

Azureの管理ポータルにアクセスし、ログインしよう。表示される画面から[WEBサイト]をクリックして表示される画面の[WEBサイトの作成]をクリックする。

Windows Azure Web Site 1

クリックすると、[コンピューティング]->[WEBサイト]->[簡易作成]が選択された状態になるので、[カスタム作成]をクリックする。

Windows Azure Web Site 2

クリックすると、以下のように[Webサイトの作成]画面が表示される。今回は前回作成したプロジェクトと同じように、[URL]には[example-alm]、[リージョン]には[日本(東)]、[データベース]には[データベースなし]を選択し、[ソース管理から発行]にチェックを付け、[→]をクリックする。

Create Windows Azure Web Site 1

クリックすると、以下のように[ソースコードの位置]画面が表示される。今回は[Visual Studio Online]を選択し、[→]をクリックする。

Create Windows Azure Web Site 2

クリックすると、以下のように[接続を承認する]画面が表示される。既に[Visual Studio Online]のアカウントがあるので、[既存のユーザー]の下の入力ボックスに[Visual Studio Online]のアカウントを入力し、[今すぐ承認]をクリックする。

Create Windows Azure Web Site 3

クリックすると、以下のようにVisual Studio Onlineの画面が表示される。アカウントに間違いがなければ[Accept]をクリックする。
 
Create Windows Azure Web Site 4

クリックし、承認が成功すると、以下のように[デプロイするリポジトリの選択]画面が表示される。今回は前回作成したプロジェクトを使用するので、[リポジトリ名]から[example-alm]を選択し、[√(チェック)]をクリックする。

Create Windows Azure Web Site 5

クリックすると、Windows Azure Webサイトが作成されるので、[状態]が[実行中]になったら、[URL]の[example-alm.azurewebsites.net]をクリックする。

Windows Azure Web Site 3

クリックすると、以下のように初期状態のWindows Azure Webサイトが表示されるのを確認する。

Windows Azure Web Site 4

ASP.NETの継続的インテグレーションと継続的デリバリ

継続的デリバリの設定

Windows Azure WebサイトとVisual Studio Onlineを上記手順でリンクさせると、Visual Studioの[チーム エクスプローラー – ビルド]に新しく[プロジェクト名_CD]という継続的デリバリ1のビルド定義が作成される。今回内容は省くが、自動生成されるこの[プロジェクト名_CD]という継続的デリバリのビルド定義はチェックイン毎にビルドを実行し、ビルドに成功するとテストを実行し、すべてのテストをパスすると、デプロイするというものである。

Continuous Delivery 1

もちろん、Visual Studio Onlineと同期をとっているので、Visual Studio Onlineにも自動的に作成されているが、念のために確認してみよう。以下の画面で[BUILD]をクリックする。

Continuous Delivery 2

クリックすると、以下のように[プロジェクト名_CD]という継続的デリバリのビルド定義が作成されていることが分かる。

Continuous Delivery 3

継続的デリバリの確認

継続的デリバリが実施されるか確認するために、このプロジェクトに新規にhtmlページを追加する。[ソリューション エクスプローラー]で右クリックし、[追加]->[HTMLページ]をクリックする。

Continuous Delivery 4

クリックすると、以下のように[項目の名前を指定]画面が表示される。[項目名]には[index]と入力し、[OK]をクリックする。

Continuous Delivery 5

クリックすると、以下のようにindex.htmlが開くので、Example Application Lifecycle Management.と入力する。

Continuous Delivery 6

入力したら、[チーム エクスプローラー – 変更]に遷移し、コミットメッセージに[Add index page “Example Application Lifecycle Management.”]と入力し、[コミット(I)]をクリックする。

Continuous Delivery 7

クリックすると、ローカルにはコミットされたものの、サーバーにはコミットされていない状態になるので、
サーバー(Visual Studio Online)と同期するために[同期]をクリックする。

Continuous Delivery 8

入力方向、出力方向のコミットの内容が問題ないか確認し、[同期(S)]をクリックする。

Continuous Delivery 9

クリックすると、以下のように正常に同期されましたと表示される。

Continuous Delivery 10

チェックインしたので、Visual Studio Onlineでビルドされているか確認してみよう。以下の画面で[BUILD]をクリックする。

Continuous Delivery 10

クリックすると、チェックインした内容をVisual Studio Onlineでビルドしていることが分かる。[Completed]をクリックする。

Continuous Delivery 11

クリックすると、ビルドが成功していることが分かる。次にデプロイされているか確認するために[Deployed]をクリックする。

Continuous Delivery 12

クリックすると、デプロイが成功していることが分かる。次に本当に先程の内容でデプロイされているか確認してみよう。[example-alm.azurewebsites.net]を表示する。

Continuous Delivery 13

表示すると、以下のように先程コミットした内容でデプロイされていることが分かる。

Continuous Delivery 14

まとめ

今回はASP.NET WebアプリケーションのALM(アプリケーション・ライフサイクル・マネジメント)についてのやり方を画面キャプチャを交えて説明してきた。前回の前提にも記載したが、自分はASP.NETの知識はC#もASP.NETも業務でやったことない状態でこれだけのことができている。実際、画面キャプチャをとりつつ、作業をしたが、最初から最後まで1時間かかっていない。

現在ではALM(アプリケーション・ライフサイクル・マネジメント)はどこか遠くの国の優秀な人しかできないものではなく、Visual Studioを筆頭に便利なツールを使うことで簡単に実現できる内容になっている。

今回の記事でALM(アプリケーション・ライフサイクル・マネジメント)がどれだけ簡単か実感してもらえれば幸いである。


  1. 継続的デプロイではない