Visual Studio 2012

  • [アーティクル]

最新アプリケーション向けに生産性が向上した IDE

Peter Vogel

 

Visual Studio 2012 Professional では、新しいテクノロジ (Windows ストア アプリや、ASP.NET Web API など) もいくつかサポートしていますが、Visual Studio チームは、"快適な IDE" を生み出すことに力を注いだようです。チームは、UI を見直すことから着手しました。この Visual Studio 2012 の UI の見直しは、マイクロソフトが Windows ストア アプリに行ったほど徹底したものではありませんが、多くの重要な変更が行われています。UI 以外をあまり強化しなかったわけではありませんが、まずは、UI を変更した "理由" から説明しましょう。

Visual Studio 2012 の "快適な IDE" を目指し、開発者の生産性を向上するために、UI の整理、よく行う作業の簡素化、ユーザビリティの向上の 3 つに重点を置いています。新しい UI は、モノクロになったことと、トップレベル メニューが "すべて大文字" になったことが最も目を引きますが、それ以上に重要な変更点はすぐには気づきません。たとえば、Visual Studio でモードを変更したときに表示される既定のツール バーの数が Visual Studio 2012 では大幅に少なくなりました (図 1 参照)。これにより画面が整理されて広く使えるようになり、数行多くコードを表示できるようになります。その結果、上下にスクロールする必要性が減り、これまでよりも簡単に "メソッド全体" を確認でき、非常に頻繁に行うコーディング作業が簡単になります。小さな変更に思えますが、Visual Studio 2012 で行った数多くの変更の方向性を表しています。

Reduced Color and Chrome Make Code Highlights Stand out More
図 1 色とクロムを減らしたことで、コードの強調表示がより際立つようになった

コードへのアクセス

コードへのアクセスが Visual Studio 2012 の新しいエクスペリエンスの重要な特徴の 1つです。たとえば、プレビュー ボタンを選択している状態でソリューション エクスプローラーのファイルをクリックしたときにまず気づくことは、Visual Studio 2012 ではダブルクリックではなく、シングルクリックでファイルが開くようになったことでしょう。ただし、コード ファイルをシングルクリックしたときに表示されるのは、そのファイルのプレビューです (そのウィンドウのタブがタブ ウェルの右端に表示されるのがその目印です)。ソリューション エクスプローラーで別のファイルをシングルクリックすると、開いていたプレビューが消え、新しいファイルのプレビューに置き換わります。ただし、プレビューしていたファイルに変更を加える場合、タブが左に移動し、そのファイルは編集モードで開かれたままの状態で表示されます。

コードを検索するときに、いちいちファイルをクリックして探すのは効率的ではありません。そこで、新しく検索とフィルターのオプションが一部のツール ウィンドウの上部に加えられ、これまでよりもはるかに効率的に目的のコードを検索できるようになります。最もわかりやすい例が、ソリューション エクスプローラー上部にあるソリューション内を検索するテキスト ボックスです。このテキスト ボックスでは、ソリューションのすべてのプロジェクト (ASP.NET Web サイト プロジェクトを除く) のファイル名、さらに重要なメンバー名を検索できます。テキストを検索するために新たなウィンドウを開く必要がないので、画面が雑然とすることなく、よく行う作業が簡素化されます。

また、画面を整理してユーザビリティを向上する方針を反映して、ソリューション エクスプローラーには検索ウィンドウと併せて、クラス ビューの機能が組み込まれるようになりました。このクラス ビューは、以前のソリューション エクスプローラーで使われていたファイル ベースのビューで、ファイル内の個々のメンバーにドリル ダウンできます (図 2 参照)。この機能を補完するためにソリューション エクスプローラー上部に [ホーム] ボタンが設けられ、このボタンをクリックするとソリューション エクスプローラーが標準のファイルの一覧に戻ります。

Solution Explorer Now Acts as a Kind of Object Browser
図 2 一種のオブジェクト ブラウザーとして機能するようになったソリューション エクスプローラー

クイック起動 (メニュー バーの右側に表示) は、プロジェクトのアセットではなく Visual Studio のアセット検索するため、私にとってはやや使い勝手が悪いと感じます。キーワードでメニューや Visual Studio のオプションを検索する場合には、クイック起動を使うと、一致する Visual Studio の項目を検索してその項目に直接アクセスできます。どの程度 Visual Studio の項目を検索するかはわかりませんが、クイック起動があれば検索する回数が増えるかもしれません。

IntelliSense の拡張

IntelliSense では、検索パラメーターが引き続き拡張され、クラスやメンバーの検索が容易になります。文字を入力するにつれて、単語の一部を照合するだけでなく、クラス名やメンバー名の大文字部分に注目した照合も行われます。たとえば、.aspx ファイルで「oc」と入力すると、OutputCache が IntelliSense リストに表示されます。

今回のリリースでは CSS でも IntelliSense が使えるようになり、Web 開発者は IntelliSense により HTML5 の新しいタグも認識されることがわかります。ASP.NET 開発者は、バインド式を入力するときにもサポートを受けられます。サンドボックス ソリューションを作成している SharePoint 開発者は、リストが短くなっているのがわかります。サンドボックス ソリューションのコード用のリストには、ファーム ソリューションでしか使わない項目が含まれなくなっています。

しかし、IntelliSense サポートの恩恵を最も受けているのは JavaScript です。Visual Studio 2012 では、JavaScript の関数や変数に関して、JavaScript のコメントが IntelliSense サポートに自動的に組み込まれるようになります。JavaScript コードで XML 形式のコメントを使用する場合、オーバーロード関数の IntelliSense サポートを生成する新しいオプションがあります。Visual Studio 2012 では、動的に読み込んだスクリプト ファイルに IntelliSense を提供する試みも行われています。JavaScript の関数呼び出しを選択し、F12 キーを押す (または、コンテキスト メニューの [定義へ移動] をクリックする) と、その関数本体を含むファイルが開きます (生成されたコードを除く)。しかし、JavaScript のサポートすべてが一様にうまく機能するわけではありません。Visual Studio 2012 が変数のデータ型を判断できないときは、多くの場合、IntelliSense は利用可能な JavaScript エンティティしかリストにしません。

ASP.NET と ASP.NET MVC の開発者

ASP.NET MVC の開発者にとって価値があるのは、モバイル アプリ (jQuery Mobile ライブラリを含む) と ASP.NET Web API をサポートするアプリの作成を支援する新しいプロジェクト テンプレートでしょう。クライアント側に対応するマイクロソフトの単一ページ アプリケーションをサポートするプロジェクトの種類もあります。この単一ページ アプリケーションは、Knockout Model-View-ViewModel (MVVM)/データバインド ライブラリ、HTML5 History API、ダウンロードしたオブジェクトの管理用のマイクロソフト Upshot ライブラリなど、複数の JavaScript API を統合して、AJAX アプリの作成をサポートします。マイクロソフトが選択した JavaScript ライブラリ (すばらしい選択です) で十分ならば、それ以上独自のテクノロジ セットをゼロから組み立てる必要がなくなります。

また、Visual Studio 2012 では、Web と SharePoint の開発者向けに、JavaScript のコードがオートフォーマットされるようになります。JavaScript の形式にオートフォーマットとは異なる標準を設けている場合、[ツール] メニューの [オプション] でこの機能を無効にするか、この機能を調整します。

Visual Studio 2012 では、HTML5 の新しいタグをサポートします。ASP.NET の default.aspx ページにも <section> タグが含まれています。開発者は、ページの構造を明確にする方法として、<span> タグや <div> タグを CSS の共有クラスと無理に併用するのをやめて、ページ構造を記述するための専用タグを使用できます。以前の HTML タグに対する IntelliSense は、HTML5 の新しい属性 (カスタム データ属性や Accessible Rich Internet Applications アクセシビリティ属性など) をサポートします。もちろん、ブラウザーが新しいタグと属性を認識できることが必要です。

Page Inspector

Web 開発者にとっての大きな変更は、デバッグに関するものです。これまで同様、F5 キーを押して、ASP.NET アプリケーションや ASP.NET MV アプリケーションをデバッグできますが、デバッグ ツールバーの新しいドロップダウン リストを使うと、コンピューターにインストールされているすべてのブラウザーがリストに自動的に表示されるので、簡単にブラウザーを切り替えることができます。ただし、最も重要な変更は Page Inspector です。Page Inspector により、ページでの問題解決の方法が変わります。

ASP.NET ページの一般的なデバッグのプロセスには、7 つの段階があります。つまり、ページをブラウザーで開き、エラーを確認し、問題点を推測して、ブラウザーを閉じます。問題点を修正してから、再度ページをブラウザーで開き、問題が解決されたかどうかを確認します。Page Inspector により、このプロセス全体がまとめられます。ソリューション エクスプローラーでページ (.aspx、.cshtml、または .vbhtml) を右クリックして、[View in Page Inspector] (Page Inspector で表示) をクリックするだけです。すると、Visual Studio 2012 が自身を複数の新しいペインに再構成し、ブラウザーにレンダリングされるとおりのページ、右クリックしたソース ファイル、ブラウザーに送信される HTML のツリー ビュー、およびページに適用される CSS 対話型ビューをそれぞれのペインに表示します。これらのペインはすべて編集可能です (図 3 参照)。

Page Inspector Shows All the Markup that Controls How the Page Is Rendered
図 3 Page Inspector によりページのレンダリング方法を制御するマークアップがすべて表示される

ブラウザー ビューでカーソルを動かすと、それに応じて HTML ペインと CSS ペインが更新されて、ブラウザー上での操作に応じた内容が表示されます。ソース ファイルはブラウザーに合わせて移動しませんが、ソースを更新可能な状態であることは変わりません。ソースに変更を加えると、ブラウザー ビューが最新状態に更新され、変更の結果が表示されます。CSS ビューでは、ルールを無効にしたり、あるルールをクリックして、そのルールを含む CSS ファイルに切り替えたりできます。ルールを変更した場合、ページは変更を反映して再表示されます。

17 インチ モニターでさえも、ビューは狭く、Page Inspector にはスタイルシートの絶対位置に関する問題があるので (おそらく絶対位置を使用することはないと思いますが)、完璧なソリューションではありません。注意点はありますが、Page Inspector は欠かせないツールになるでしょう。

テスト

デバッグ機能の強化はWeb 開発者向けのものでしたが、テスト駆動開発 (TDD) のサポート強化はすべての開発者の役に立ちます。従来のテスト出力ウィンドウは、新しいテスト エクスプローラーに置き換わります (図 4 参照)。ここには TDD の多くのアクティビティが集約され、[テスト] メニューの [ウィンドウ] から使用できます。テスト エクスプローラーでは、前回実行したすべてのテストについて、テストごとの所要時間などの状態がリスト表示されます (パフォーマンスのボトルネックとなる箇所を早期に確認できます)。テスト エクスプローラーで、失敗したテストをクリックすると、テスト エクスプローラーの下部にその情報が表示されます。テスト エクスプローラーで、テストをダブルクリックすると、テストのコードが表示され、デバッグ セッションを開始できます。テストのリストがとても長い場合は、キーワードでフィルター処理できます。テスト エクスプローラーでは、すべての失敗したテストをグループにして他のテストと混在させ内容になったため、Ignore 属性が設定されたすべてのテストを暗黙のうちにスキップすることなく表示します。

Test Explorer Provides a More Interactive Way to View and Run Tests
図 4 テストの確認と実行がよりインタラクティブに行えるテスト エクスプローラー

また、テスト エクスプローラーでは、テスト実行の新しいオプションとして、まだ実行していないテストをすべて実行するというオプションがあります。最初、テストはすべて [未実行] カテゴリにありますが、新しいコードの機能を確認するテストを実行すると、(最終的に) いくつかのテストは [成功] カテゴリに移行します。新しいコードが機能することを実証したら、[未実行のテストの実行] を選択して、また実行していないテストを実行し、以前のコードに新しいエラーが発生していないことを実証できます。テスト エクスプローラーは、UI デザインの整理と同時に、よく行う作業をシンプルにしたもう 1 つの例です。

テストにおける最も大きな変更は、残念ながら Visual Studio 2012 Ultimate でしか利用できませんが、ビルド後に毎回テストを自動実行する機能です。また、Ultimate と Premium では、テストのコード カバレッジもサポートされており、テストされていないコード行を確認できますが、私個人としてはこのツールの有効性には疑問があります (プロの開発者には逆の意見の人もいます)。

もちろん、Windows 8

当然ながら、マイクロソフトは、Windows 8 用アプリケーションを作成する開発者にサポートを提供しています。このようなアプリの作成には Windows 8 開発者ライセンスが必要ですが、Visual Studio 2012 では、初めてこの種類のプロジェクトを選択するときに、ライセンスの取得をガイドするウィザードが表示されます。

Visual Studio 2012 では、Windows ストアのアプリケーション用に、次の 6 つのプロジェクトの種類を用意しています。3 つの UI (空、グリッド、および分割)、クラス ライブラリ、言語に依存しない Windows ランタイム コンポーネント、およびテストライブラリの 6 種類です。プロジェクトの種類の多様性から、Windows ストア アプリケーションの幅広い可能性がわかります。

Web アプリが複数のブラウザーをサポートするように、Windows ストア アプリも、ツール バーのドロップダウン リストから希望する環境を選択して、さまざまな環境でデバッグできます。既定の環境は [ローカル コンピューター] ですが、[シミュレーター] を選択すると、図 5 のようなマイクロソフトのタブレット型シミュレーターが起動します。

The Simulator Option for Testing Windows Store Applications Mimics a Tablet
図 5 タブレットを模した Windows ストア アプリケーションのテスト用シミュレーター オプション

シミュレーターの右側のボタンは、マウスの操作をタッチに似た操作をする各種ポインターに変更するものです (開発用コンピューターにタッチスクリーンが備えられていない場合を想定しています)。シミュレーションを行ったタブレットに緯度、経度、および標高を設定して、位置対応アプリをテストできるボタンもあります。[時計回りに回転する] ボタンおよび [反時計回りに回転する] ボタンをクリックすると、縦長モードと横長モードを切り替えることができます。タブレットのシミュレーターでスクリーンショットをキャプチャして、Windows のクリップボードに保存するボタンもあります。シミュレーターでのテストは、実際の物理デバイスと同じではありませんが、初期テストには十分なので、簡単なテストのためだけにアプリを別のデバイスに移す必要がなくなります。

UI についての再考

Visual Studio 2012 の UI では、"見た目の乱雑さ" が減っていることについてさまざま述べてきましたが、ベータ版からリリース候補 (RC) 版の間にマイクロソフトはいくつか "色彩的な乱雑さ" を追加しています。一般に、UI デザインの目標は、同種のものを同じ形状 (たとえば、メニュー項目はメニュー項目、ボタンはボタンで同じ形状) にし、異種のものは異なった形状 (たとえば、ボタンとメニュー項目とは異なった形状) にすることです。Visual Studio 2012 RC では、適切 (かつ明白) に見た目の異同の区別のバランスが "十分に" 取られています。数年後には、これ以前の Visual Studio が "派手" だと考えられるようになっているとしたら面白いですね。

UI の配色は議論を呼びましたが、それ以上に議論になったのが、トップ レベル メニュー項目を大文字表記にして多くのツールバーからメニューを目立たせるというマイクロソフトの決定でした。大人は、大文字小文字が混じって表記された単語をアセンダー (d、b、f などの上に伸びた部分) とディセンダー (g や y などの下に伸びた部分) の形によって認識する、ということが研究で示されています。すべて大文字表記にした場合は、どの単語も同じ長方形です。しかし、Visual Studio 2012 において、メニューを利用するとき、開発者がメニューを "読んで" いるとは思えません。メニュー項目 ([ファイル]、[編集]、[表示]、[ウィンドウ]、[ヘルプ]) の位置は決まっているので、開発者は、項目名を読むのと同じように、位置からでもメニューを利用できます。

経験豊富なユーザーは変更があると必ず当惑するものですが、大文字表記になった影響を最も受けるのは新しいユーザーです。個々のメニュー項目の見分けやすさが減ったことで、"マウスの腕前" が上がるでしょうか。

今のところは、トップ レベル メニュー項目を大文字と小文字で表記する、さまざまなレジストリ ハックと Visual Studio 2012 の拡張機能が公開されています。Visual Studio 2012 の最終リリース バージョンのオプションには、きっと全員が満足することでしょう。

Blend for Visual Studio と Windows ストア アプリ

Windows ストア アプリ作成のサポートの一環として、Blend for Visual Studio が Visual Studio 2012 パッケージに含まれています。ただし、Blend はオプションのため、カスタム インストール オプションを選択して、Visual Studio 2012 に含めてインストールする必要があります。Blend は XAML と Windows Presentation Foundation (WPF) の両方をサポートしていますが、残念ながら、Visual Studio 2012 内からは Windows ストア アプリケーション開発にしか利用できません。

Blend は Visual Studio 2012 に同梱されていますが、Visual Studio 2012 と真に統合されているとは言えません。Windows ストア アプリケーションの UI ファイルを右クリックすると、[Blend で開く] を選択できます。このオプションをクリックすると、Blend が新しいウィンドウで開きます。さいわい、Blend はプロジェクトのファイル リストを取得するので、Visual Studio 2012 に戻らずにファイルを修正できます (実際、Visual Studio 2012 に戻ったときに、"File has been updated outside of Visual Studio" (Visual Studio 以外でファイルが更新されています) という、Blend でファイルが変更されたことを示すメッセージが表示されます)。Blend でプロジェクトに追加されたファイルは、Visual Studio 2012 のプロジェクトに追加されます。それでも、2 つのウィンドウを移動するときには注意が必要です。Visual Studio 2012 で別のソリューションに切り替えることができますが、Blend ではその切り替えを感知したり、その切り替えに対応することはありません。それでもなお、Blend では、XAML で直接記述が必要だったさまざまなことが、グラフィカルに可能になります。

その他の変更点: マルチモニター、デバッグ、Windows Azure、および SharePoint

もちろん、変更点は他にもあります。ウィンドウを Visual Studio 2012 から切り離して、それらのウィンドウを互いにドッキングできます (マイクロソフトではこれを "ラフト" と呼んでいます)。ラフトは任意の位置 (あるいはモニター) にドラッグできます。デバッグ ウィンドウは、これまで以上にスレッド対応になり、以前よりも便利なことに、関心のあるスレッドにフラグを設定したり、それらのスレッドの表示を制限したりできます。

Windows Azure の開発者は、Windows Azure Platform Management Portal と Visual Studio 2012 がより密接に統合されたため、ASP.NET MVC アプリをクラウドに移行するのにたった数回のクリックだけでよく、Windows Azure 管理ポータルを使用するために Visual Studio を終了する必要もありません。しかし、Windows Azure 開発者に必要なものが、Visual Studio 2012 Professional にすべて揃っているわけではありません。データベース (スキーマのみ、およびスキーマとデータ) をクラウドにコピーする場合には、SQL Azure 移行ウィザードを CodePlex (bit.ly/bYN8Vb、英語) からダウンロードする必要があります。

SharePoint 開発者に対しては、SharePoint サイトの基本的なビルディング ブロックであるサイト列とコンテンツ タイプに新しいテンプレートが用意されました。また、Visual Studio 2012 では、SharePoint 開発用に SharePoint のものとほとんど同じ、ビジュアル リスト デザイナーがついに用意されました。また、SharePoint 開発者は、Visual Studio 2012 から、リモート サイトにソリューションを直接発行できます (リリースの管理の煩わしさがなくなります)。

WPF と Silverlight 開発者は、Windows ストア アプリ開発者のような、Blend との統合がまったく得られませんが、いくつかの Blend メニューの選択肢 ([アクティブなコンテナーの固定] や [Create Data Bindings For] (データ バインドの作成) など) が XAML デザイナーのコンテキスト メニューに追加されています。

 

Team Foundation サービス

複雑なアプリケーション作成するときは、シンプルかつ専用のオブジェクトを数多く作成してそれを組み立てることがソフトウェアのベスト プラクティスであることは変わらないため、ライフサイクル全体を通じて多様なソフトウェア コンポーネントを管理する重要性がますます高まっています。マイクロソフト製品のうち、アプリケーション ライフサイクル管理 (ALM) ツールの拠点となるのが、Visual Studio Team Foundation Server (TFS) です。しかし、特に小さなチームでは、TFS のインストール、構成、および管理のコストによって ALM のメリットが相殺されると考えられています (この想定が間違いの場合もあります)。このような場合に、TFS のクラウド版である Team Foundation サービスが役立ちます。

Team Foundation サービスはまだプレビュー段階ですが、tfspreview.com (英語) で試す (または機能のみを確認する) ことができます。Team Foundation サービスは、Visual Studio 2012 と Eclipse の両方と統合されます (ただし、Eclipse では利用できない機能もあります)。

Team Foundation サービスでは、アプリケーションの開発プロセスの最初に、PowerPoint を使用してアプリケーションのストリーボードを設定できます。開発に着手したら、ソース管理、継続的な単体テスト (チェックイン時のみ)、および機能、タスク、バグ、フィードバック、バックログについて情報を管理するツールを使用できます。継続的インテグレーション ビルドのセット アップは (少なくとも単純なプロジェクトの場合) 比較的簡単で、Windows Azure への自動配置を含んでいます。Web ベース ツールのチーム エクスプローラーを使うと、どこからでもプロジェクトをレビューできます。

この記事の執筆時点では、価格はまだ発表されていません。マイクロソフトによると、プレビュー段階の後も、無償レベルのサービスは引き続き提供され、無償レベルのサービスでは不十分なユーザーには、有償レベルのサービスが用意される予定です。

アップグレードするかどうか

Visual Studio 2008 以来、Visual Studio は対応するバージョンの Microsoft .NET Framework とは "結び付けられていない" 状態だったので、.NET Framework のバージョンをアップグレードすることなく、新しい IDE にアップグレードできました。Visual Studio 2012 では、すべてのプロジェクトが .NET Framework 4.5 に自動的にアップグレードされることがなくなったため、自由度が高くなっています。このようなアップグレードは元に戻すことはできません。Visual Studio 2012 で SQL Server 2012 Express LocalDB (Visual Studio 2012 のみでサポートされる、構成が不要なバージョンの SQL Server Express)、または .NET Framework 4.5 のみで使用可能な機能を使用していない場合には、プロジェクトを Visual Studio 2012 と Visual Studio 2010 の間でラウンドトリップさせることができます。

.NET Framework 4.5 にアップグレードする場合は、必然的に Visual Studio 2012 へのアップグレードが必要になります。しかし、.NET Framework 4.5 にアップグレードしない場合にも、やはり、Visual Studio 2012 へのアップグレードを検討する価値があります。値段もそれほど高くなく (Professional は MSDN サブスクリプションなしで 499 ドル)、ASP.NET 開発者にとっては、Page Inspector だけでもコストに見合う価値があるでしょう。Windows Azure 開発者にとっては、Visual Studio 2012 とより密接に統合されることに価値があります。新しいソリューション エクスプローラーとテスト エクスプローラー ツールはとても使いやすいので、少なくとも、.NET 開発者は皆、プレビューに時間を使うべきです。

Peter Vogel は、サービス指向アーキテクチャ、XML、データベース、および UI デザインの専門技術を持ち ASP.NET 開発に特化した企業、PH&V Information Services の社長です。

この記事のレビューに協力してくれた技術スタッフの Mike Abrahamson と Mike Fourie に心より感謝いたします。