다음을 통해 공유

Visual Studio 2013 Update 2 での HTML5 関連の強化点

  • 아티클

Visual Studio 2013 は、先月 (2014/5) 公開された Windows 2013 Update 2 によってHTML5 を使用した開発についての機能が大幅に追加されました。

今回の記事では、Visual Studio 2013 Update 2 によって行われた HTML5 関連の機能強化によって、あらたになにができるようになったのか、その全体像を俯瞰的に紹介します。

(※) この記事は、日本マイクロソフトの有償イベント de:code のセッション DE-015 をもとに書いています。

 

開発基盤としての HTML5

Visual Studio 2013 Update 2 の強化点について紹介する前に、簡単に HTML5 の特徴について振り返ってみましょう。

HTML5 の特徴というと、セマンティックであるとか、マークアップが簡略化されたであるとか、マルチメディアのサポートだとかありますが、いちばん特徴的なのは、アプリケーションのプラットフォームとして設計されているということでしょう。

もともと、HTML はオンライン上のドキュメント、「文書」を記述する目的に設計され発展してきましたが、HTML5 ではそれに加え、アプリケーションのプラットフォームとしての仕様も盛り込まれています。

さらには、仕様を策定する際には、XMLHttpRequest に代表されるような、当時、Web 標準ではなかったものの、HTML ベースのアプリケーション開発に広くデファクトスタンダートとして使われてきた技術を多く取り入れるとともに、慣例的に多く使われながらも「次世代の HTML」と目されていた XHTML で廃止されたタグにも意味を与えて復活させ、既存コンテンツと互換とスキルセットの蓄積を活かせるようにしました。

また、アプリケーションの機能の範囲をブラウザ内に閉じることはせず、ストレージやネットワーク、センサーやデバイス向けの API の仕様を策定し、デスクトップアプリと遜色のない機能を実装しました。現在はまだ、HTML5 のすべての API を実装した Web ブラウザーは存在しませんが、もしそれらが完全にサポートされたあかつきには、Web ブラウザー上で動作するアプリとデスクトップアプリの機能的な差は、ほんのわずかなものになることでしょう。

広義の HTML5 はマークアップや API だけでなく、CSS3、SVG、WebGL など、さまざまな関連技術を含み、それぞれの用途にもっともあった技術を使って開発することができます。

こうした利便性に富んだ HTML5とその関連技術が提供するさまざまな標準化された仕様は、Webブラウザ内で動作するコンテンツにとどまらず、クロスプラットフォーム開発が必要とされるアプリの開発でも使用されるようになっています。

image
(HTML5 をとりまく状況)

とくにモバイル端末用のアプリ開発では、使用する言語がそれぞれ異なるため、HTML5 を使用してクロスプラットフォーム開発を行うためのフレームワークが早くから登場していました。

現在では、こうしたフレームワークを使用しなくても、HTML5 で作られたアプリをネイティブでサポートするフラットフォームも出てきています。

Windows 8 も HTML5 アプリをネイティブでサポートしているプラットフォームのひとつです。

つまり、いまや HTML5 を使用しすれば、理論上、Web ブラウザ、デバイス、プラットフォームの垣根を越えた開発が可能になりつつあります。

 

Visual Studio からみた HTML5
そして Update 2 でなにができるようになったのか?

Visual Studio は早くから HTML5 を意識した開発が行えるようになっていました。

Visual Studio 2010 SP1 からは HTML5、CSS3 のインテリセンスとターゲットスキーマが提供され、Visual Studio が提供するさまざまな入力補完機能を使用して HTML5 を使用した Web コンテンツが記述できるようになりました。

Visual Studio 2012 では、HTML5 と JavaScript を使用して、Windows 8 の新しい UI 上で動作する Windows ストア アプリを開発できるようになりました。

そして、先日行われた Visual Studio 2013 Update 2 ではあらたに Windows Phone 8.1 アプリと、一般には SDK が公開されないものの xbox のアプリが開発することができるようになりました。なお、Windows ストア アプリと Windows Phone 8.1 アプリはコードを共有しつつ同時開発が可能になりました。

さらに Professional 以上のエディションでは、アドイン Multi-Device Hybrid Apps をインストールすることにより Apache CORDOVA を使用して iOS、Android 用のアプリが開発できるようになりました。

image
(Visual Studio 2013 と HTML5 アプリ)

Visual Studio 2013 Update の公開とタイミングを同じくして、Windows ストア アプリのフレームワークであった WinJS (Windows Library for JavaScript) がオープンソース化され、Windows ストア アプリだけでなく、Web ブラウザー上で動作する一般的な HTML5 アプリでも使用できるようになりました。

image
(WinJSの提供する機能)

WinJS はマークアップ記述で使用可能なさまざなリッチなコントロールの提供だけでなく、データバインドや非同期モデル、ナビゲーションモデルなど、アプリケーションを開発するうえであると便利なさまざな機能を提供します。

なお、このあたらしい WinJS の機能は、以下のページで実際に試すことができます。

『Try WinJS』
https://try.buildwinjs.com/

WinJS のソースコードは GitHub で公開されおり、自由にダウンロードして使用することができます。

 

まとめ

Visual Studio 2013 は、Update 2 を適用することにより HTML5 を使用した開発の可能性が大きく広がりました。

現在のところ Visual Studio 2013 (Professional 以上のエディション) + Update 2 + Windows  8.1 の組み合わせでは、HTML5 ベースの以下のものを開発することができます。

  1. Web コンテンツ
  2. Windows ストア アプリ
  3. Windows Phone 8.1 アプリ
  4. Android アプリ
  5. iOS アプリ (パッケージングと AppStore への提出には Mac が必要)

また、正式にはサポートしていませんが、Chrome Apps や Firefox OS 用のアプリも作ることもでき、なくはありません。

次回の記事から Visual Studio 2013 Update 2 で追加された特徴的な機能について紹介していきますのでお楽しみに。

 

Real Time Analytics

Clicky

Comments