Visual Studio 2013 による コード 複 製 検 出 を 使 用 した 重 複 コードの 検 出 2014 Microsoft Corporation. All rights reserved. 1
目 次 Visual Studio 2013 による コード 複 製 検 出 を 使 用 した 重 複 コードの 検 出... 1 1. ソリューションのコード クローン 分 析 の 実 行 と コードの 比 較... 4 2. コントローラーとビューへのコード 追 加... 8 3. 重 複 コードをリファクタリング... 14 2 2014 Microsoft Corporation. All rights reserved.
演 習 の 目 標 Visual Studio 2013 のコード 複 製 検 出 機 能 を 使 用 した 重 複 コードの 検 出 につい て 確 認 します 演 習 の 概 要 ソリューションのコード クローン 分 析 の 実 行 とコードの 比 較 コントローラーとビューへのコードの 追 加 重 複 コードをリファクタリング 演 習 の 前 提 条 件 この 自 習 書 を 始 める 前 に 以 下 の 前 提 条 件 を 満 たす 必 要 があります Visual Studio Premium 2013 with Update 4 もしくは Visual Studio Ultimate 2013 with Update 4 - 以 下 のページから [90 日 間 の 無 償 評 価 版 ] を 入 手 できます - http://www.visualstudio.com/downloads/download-visual-studiovs#downloadfamilies_1 以 下 の 自 習 書 による 学 習 が 終 了 していること - Team Foundation Server のインストールと 最 初 の 一 歩 - Visual Studio 2013 による CodeLens を 使 用 した エディターでの 予 想 所 要 時 間 コード 情 報 の 検 索 60 分 2014 Microsoft Corporation. All rights reserved. 3
1. ソリューションのコード クローン 分 析 の 実 行 と コー ドの 比 較 1. Visual Studio を 起 動 し [チーム エクスプローラー] ウィンドウのツール バーで [ホ ーム] ボタンをクリックします <<01_チーム エクスプローラー ホームへ 移 動 >> 2. [チーム エクスプローラー - ホーム] ウィンドウの [プロジェクト] セクションで [ソ ース 管 理 エクスプローラー] をクリックします <<02_ソース 管 理 エクスプローラーを 開 く>> 4 2014 Microsoft Corporation. All rights reserved.
3. [ソース 管 理 エクスプローラー] ウィンドウの 左 ペインで [Visual Studio 自 習 書 SelfStudy_CodLens] ノードをクリックし 右 ペインで [SelfStudy_CodeLens.sln] をダ ブルクリックします <<03_SelefStudy_CodeLens.sln を 開 く>> 4. Visual Studio メイン メニューの [ 分 析 ソリューションのコード クローン 分 析 ] を 選 択 します <<04_ソリューションのコード クローン 分 析 の 実 行 >> 5. [コード クローン 分 析 結 果 ] ウィンドウが 表 示 され [ 中 間 の 一 致 ] 複 製 グループが 二 つ 表 示 されることを 確 認 します <<05_コード クローン 分 析 結 果 >> 2014 Microsoft Corporation. All rights reserved. 5
6. 一 つ 名 の [ 中 間 の 一 致 ] ノードを 展 開 し [AccountController:ExternalLoginCallback] メ ソッドと [AccountController:Login] メソッドが 表 示 されることを 確 認 します <<06_ 中 間 の 一 致 複 製 グループの 展 開 >> 7. [コード クローン 分 析 結 果 ] ウィンドウで [AccountController:ExternalLoginCallback] メソッドと [AccountController:Login] メソッドの 行 にマウス カーソルを 移 動 すると 複 製 箇 所 のソース コードのプレビュー ウィンドウがポップ アップすることを 確 認 し ます <<07_ 検 出 されたソース コードのプレビュー>> 8. [コード クローン 分 析 結 果 ] ウィンドウで [Shift] キーを 押 しながら [AccountController:ExternalLoginCallback] メソッドと [AccountController:Login] メソ ッドの 行 をクリックし 選 択 したら マウスの 右 ボタンをクリックします コンテキス ト メニューの [ 比 較 ] を 選 択 します <<08_ 重 複 が 検 出 されたソース コードを 並 べて 比 較 >> 6 2014 Microsoft Corporation. All rights reserved.
9. 二 つのソース コードが 左 右 に 並 べて 表 示 されることを 確 認 します <<09_ソース コードの 重 複 状 況 を 確 認 >> 10. 水 平 スクロール バーを 右 方 向 にスクロールすると 左 右 のウィンドウが 連 動 してスク ロールすることを 確 認 します ソース コード 8 行 目 末 尾 の 匿 名 型 がオブジェクト 初 期 化 子 とともにインスタンス 化 されている 部 分 で [RememberMe] プロパティ 値 が 異 な るものの その 他 の 部 分 は 一 致 していることを 確 認 します <<10_オブジェクト 初 期 化 子 による 匿 名 型 の 初 期 値 指 定 が 異 なる>> 11. コードの 比 較 ウィンドウを 閉 じます 2014 Microsoft Corporation. All rights reserved. 7
2. コントローラーとビューへのコード 追 加 1. [ソリューション エクスプローラー] ウィンドウで [SelfStudy_CodeLens Controllers HomeControllers.cs] をダブルクリックし コード エディターで 開 きます <<11_HomeController.cs を 開 く>> 2. [HomeController.cs] コード エディター ウィンドウで [Index] アクション メソッド を 探 します メソッド 先 頭 にアクセス 時 刻 に 応 じたグリーティング メッセージを 作 成 するコードを 追 加 します <<12_グリーティング メッセージ 生 成 処 理 の 実 装 >> 8 2014 Microsoft Corporation. All rights reserved.
3. [ソリューション エクスプローラー] ウィンドウで [SelfStudy_CodeLens Controllers AccountControllers.cs] をダブルクリックし コード エディターで 開 きます <<13_AccountController.cs を 開 く>> 4. [AccountController.cs] コード エディター ウィンドウで [Login] アクション メソッ ドを 探 します メソッド 先 頭 に [HomeCOntroller.cs] の [Index] アクション メソッド と 同 様 のアクセス 時 刻 に 応 じたグリーティング メッセージを 作 成 するコードを 追 加 し ます <<14_グリーティング メッセージ 生 成 処 理 の 実 装 >> 2014 Microsoft Corporation. All rights reserved. 9
5. [ソリューション エクスプローラー] ウィンドウで [SelfStudy_CodeLens Views Home Index.cshtm] をダブルクリックし コード エディターで 開 きます <<15_Index ビューを 開 く>> 6. class 属 性 値 として [row] を 持 つ div 要 素 の 最 初 の h2 要 素 の 次 に HomeController.cs の [Index] アクション メソッドで 生 成 される ViewBag.GreetingMessage プロパティ をレンダリングする <h3>@viewbag.greetingmessage</h3> を 追 加 します <<16_Index ビューに ViewBag オブジェクトの GreetingMessage プロパティ レンダ リングを 追 加 >> 10 2014 Microsoft Corporation. All rights reserved.
7. [ソリューション エクスプローラー] ウィンドウで [SelfStudy_CodeLens Views Account Login.cshtm] をダブルクリックし コード エディターで 開 きます <<17_Login ビューを 開 く>> 8. 最 初 の h2 要 素 の 次 に AccountController.cs の [Login] アクション メソッドで 生 成 さ れる ViewBag.GreetingMessage プロパティをレンダリングする <h3>@viewbag.greetingmessage</h3> を 追 加 します <<18_Login ビューに ViewBag オブジェクトの GreetingMessage プロパティ レンダ リングを 追 加 >> 9. [Ctrl + Shift + S] を 押 下 し 変 更 のすべてを 保 存 します 10. [Ctrl + shift + B] を 押 下 し ソリューションをビルドし ビルドが 正 常 終 了 することを 確 認 します 2014 Microsoft Corporation. All rights reserved. 11
11. [ソリューション エクスプローラー] ウィンドウで [SelfStudy_CodeLens Views Home Index.cshtm] をダブルクリックし コンテキスト メニューの [ブラウザーで 表 示 ] を 選 択 します <<19_Index.cshtml をブラウザーで 表 示 >> 12. Web ブラウザーが 起 動 し Index ビューが 表 示 されアクセス 時 間 に 応 じたグリーティ ング メッセージが 表 示 されることを 確 認 したら ページ 右 上 の [ログイン] をクリッ クします <<20_ブラウザーに 表 示 されたグリーティング メッセージを 確 認 >> 12 2014 Microsoft Corporation. All rights reserved.
13. Login ビューが 表 示 されアクセス 時 間 に 応 じたグリーティング メッセージが 表 示 され ることを 確 認 します <<21_Login ビューに 表 示 されたグリーティング メッセージを 確 認 >> 2014 Microsoft Corporation. All rights reserved. 13
3. 重 複 コードをリファクタリング 1. Visual Studio メイン メニューの [ 分 析 ソリューションのコード クローン 分 析 ] を 選 択 します 2. [コード クローン 分 析 結 果 ] ウィンドウに [ 強 い 一 致 ] 複 製 グループが 表 示 されること を 確 認 します [ 強 い 一 致 ] 複 製 グループ ノードを 展 開 すると [AccountController:Login] メソッドと [HomeController:Index] メソッドでコードの 重 複 が 検 出 されたことを 確 認 します <<22_ 強 い 一 致 複 製 グループの 内 容 を 確 認 >> 3. [コード クローン 分 析 結 果 ] ウィンドウに [ 強 い 一 致 ] 複 製 グループ ノードで [Shift] キーを 押 しながら [AccountController:Login] メソッドと [HomeController:Index] メソ ッドを 複 数 選 択 し 右 クリックします コンテキスト メニューの [ 比 較 ] オプション を 選 択 します <<23_コード 重 複 箇 所 の 確 認 >> 14 2014 Microsoft Corporation. All rights reserved.
4. コードの 比 較 ウィンドウが 表 示 され [AccountCOntroller] クラスの [Login] アクショ ン メソッドで [ViewBag.ReturnUrl] プロパティへの 代 入 がある 以 外 は コード 内 容 が 重 複 していることを 確 認 します <<24_ 重 複 コードを 比 較 >> 5. コードの 比 較 ウィンドウを 閉 じ [HomeController.cs] コード エディター ウィンドウ に 切 り 替 えます 6. [HomeController] クラスの [Index] アクション メソッドの [return] ステートメント を 除 くステートメント 部 分 を 範 囲 選 択 し 右 クリックします コンテキスト メニュー の [リファクター メソッドの 抽 出 ] を 選 択 します <<25_メソッドの 抽 出 リファクタリング>> 7. [メソッドの 抽 出 ] ダイアログ ボックス ウィンドウで [ 新 しいメソッド 名 ] テキスト ボックスに GetGreetingMessage と 入 力 し [OK] ボタンをクリックします 2014 Microsoft Corporation. All rights reserved. 15
<<26_メソッドの 抽 出 >> 8. [HomeController.cs] コード エディター ウィンドウで [Index] アクション メソッド の 下 に [GetGreetingMessage] メソッドが 追 加 され グリーティング メッセージ 生 成 ロジックが 新 しく 作 成 されたメソッドに 移 動 したことを 確 認 します また [Index] ア クション メソッドで 新 しく 作 成 された [GetGreetingMessage] メソッドを 呼 び 出 し ていることを 確 認 します <<27_GetGreetingMessage メソッドの 分 離 >> 16 2014 Microsoft Corporation. All rights reserved.
9. [GetGreetingMessage] メソッドのアクセス 修 飾 子 を [private] から [public] に 変 更 し ます <<28_GetGreetingMessage メソッドのアクセス 修 飾 子 を public に 変 更 >> 10. [AccountController.cs] コード エディター ウィンドウに 切 り 替 え [Login] アクション メソッド 内 のグリーティング メッセージ 生 成 部 分 のロジックを 選 択 し 削 除 します <<29_AccountController クラスからグリーティング メッセージ 生 成 ロジックを 削 除 >> 11. 削 除 したコードの 代 わりに [GetGreetingMessage] メソッドの 呼 び 出 し 処 理 を 追 加 し ます <<30_AccountController クラスから GetGreetingMessage メソッドを 呼 び 出 すように 修 正 >> 2014 Microsoft Corporation. All rights reserved. 17
12. [Ctrl + Shift + S] を 押 下 し 変 更 のすべてを 保 存 します 13. [Ctrl + shift + B] を 押 下 し ソリューションをビルドし ビルドが 正 常 終 了 することを 確 認 します 14. [ソリューション エクスプローラー] ウィンドウで [SelfStudy_CodeLens Views Home Index.cshtm] をダブルクリックし コンテキスト メニューの [ブラウザーで 表 示 ] を 選 択 します 15. Web ブラウザーが 起 動 し Index ビューが 表 示 されアクセス 時 間 に 応 じたグリーティ ング メッセージが 表 示 されることを 確 認 したら ページ 右 上 の [ログイン] をクリッ クします 16. Login ビューが 表 示 されアクセス 時 間 に 応 じたグリーティング メッセージが 表 示 され ることを 確 認 します 17. Visual Studio メイン メニューの [ 分 析 ソリューションのコード クローン 分 析 ] を 選 択 します 18. [コード クローン 分 析 結 果 ] ウィンドウから グリーティング メッセージ 生 成 ロジッ クの 重 複 検 出 が 解 消 したことを 確 認 します <<31_グリーティング メッセージ 生 成 処 理 重 複 の 解 消 >> 18 2014 Microsoft Corporation. All rights reserved.