8nights 大阪セッションで Windows ストアアプリ開発について話しました

去る 2012 年 12 月 6 日、Windows ストアアプリに興味のある web 開発者やアプリ開発者向けのイベント 8nights が開催されました。このイベントで、はてなブックマークのディレクターの長山さん、デザイナーの川上さんと共に「はてなが語る “はてなブックマークアプリ” 開発の裏側」という題で話をしてきました。

大阪セッション - 8nights

かなり緊張してしまって、話そうと思っていたことを話し忘れたり、話すつもりでなかったことを話してしまい時間が足りなくなってしまったりしたのですが、何かしら Windows ストアアプリ開発に興味を持って頂けるようなことを一つでもお伝えできていたならば良いなぁと思います。 PC メーカーさんのプレゼンも面白かった (特に Panasonic さんとこの掛け合いは印象に残りました) ですし、クスールの松村さんのお話やユビキタスエンターテインメントの清水さんのお話はアプリ開発の勉強になりましたし、全体的に非常に良かったイベントだと思います。

さて、せっかくなので、Windows ストアアプリを開発してみてどうだったか、ってことと、8nights の懇親会で個人的にお話した内容などを書き残しておきます。

Windows ストアアプリを開発してみて

Windows ストアアプリを開発する前の知識・経験としては、以下のような感じです。

これまでのアプリ開発の経験としては、Android アプリの勉強を軽くしたぐらい (実際に何か Android アプリをリリースしたことはない; 「Hello World」レベル)
普段の業務では、ブラウザ拡張の開発で JavaScript に触れることが多い
ブラウザ拡張以外で HTML, CSS に触れる機会はほとんどない
- HTML や CSS については、必要最低限の情報を追いかけている程度で、ばりばり使うわけではない
一般的なアプリケーション設計の話については、GOF 本とかそこら辺の本を読んだ程度
Visual Studio を使ったことはない; IDE で使ったことがあるのは Eclipse ぐらい

Windows ストアアプリの開発をするということになって、勉強するための方法としては、以下のことを行いました。

Microsoft 主催のセミナー (Developer Camp) に参加する
MSDN のドキュメントを読む

細かい部分は MSDN のドキュメントを読めばいいのですが、ざっくりとした話 (どういう機能があるのかとか、どういうところに気を付ければいいのか) はドキュメントだけではわかりにくいので、参加できるならば Developer Camp に参加すると良いと思います。

MSDN のドキュメントは結構量が多いので、最初は全体像がよくわからずにどこから読めばいいか悩むかもしれません。「Windows ストアアプリの作り方 - Hatena Developer Blog」の下の方の「今後の道標」に、特に最初に読むと参考になるであろうページを挙げていますので、参考にして頂ければと思います。 Windows ストアアプリ開発に関する書籍も出てきていますし、書籍も読んでみてもいいかもしれないですね。

で、実際に開発して思ったことは以下のような感じです。

ストアアプリを開発することは非常に簡単に取り掛かれる
- IE エンジンの上で動くので、HTML + CSS + JS の知識さえあれば、とりあえず動くものは作れる
- Web 開発者であれば HTML, CSS, JS のノウハウが溜まっていると思うので、ノウハウが活かせるというのも良い
Web ページとの違いで苦労する部分もある
- Web ページだと、よほど JS をばりばり使っていない限りはページ遷移することが当たり前だが、ストアアプリだとページ遷移しない、とか
- MVC の知識などの GUI アプリ開発の知識、ノウハウも必要
WinJS を使えば、アプリ的な挙動を簡単に実現できる
- WinJS という Windows ストアアプリ用の JavaScript ライブラリが用意されている
- スタート画面のように、タイルが並んでいて横スクロールするような UI も WinJS のクラス (WinJS.UI.ListView) で用意されている
- HTML テンプレートとかもあるし、CommonJS Promise/A の実装や XMLHttpRequest のラッパー関数もある
とはいえ、WinJS を使いこなすのは難しい
- MSDN にサンプルコードやクイックスタート的なドキュメントがあるのでとりあえず使うのは簡単だが、詳細な挙動などを調べだすとかなり時間がかかる *1
- WinJS のソースコードを読んだりもした
WinJS の使用は必要最低限にとどめて、使い慣れた JavaScript ライブラリを使うのが開発効率的には良さそう

Web 開発者なら、かなり簡単に Windows ストアアプリ開発に取り組めると思います。一方で、web 開発とは勝手が違う部分もあるので、そこら辺は勉強しながら、って感じですね。

8nights の懇親会で話したことなど

懇親会で質問頂いたことについて、個人的な意見を書いておきます。

本当に Windows ストアアプリ開発って取り組みやすいの?

『「Web 開発者なら Windows ストアアプリ開発に取り組みやすい」って言ってるけど、どれぐらい簡単なの? Android アプリと比べても簡単なの?』という話。簡単とか難しいとかっていうのは大いに主観が入るところなので難しいのですが、少なくとも私は Android アプリの勉強をして感じた難しさに比べて、Windows ストアアプリを HTML + CSS + JS で開発するのははるかに簡単だと思いました。

Windows ストアアプリ開発の入り口としては、「クロスブラウザで動く XHR が使えますので、ブラウザ上で動くアプリを作ってください」というのを想像して頂ければわかりやすいと思います *2。 Web 開発者にとっては Android アプリ開発 *3 と比べると簡単だと思います。

JavaScript も C# もできる人ならどっちを使うべき?

『Windows ストアアプリ開発は JavaScript でも C# でもできるけど、両方できる人ならどっちでやった方がいい? JS でもコード補完って効くの?』という話。

まず JS でコード補完してもらえるかどうかという話ですが、Visual Studio の IntelliSense さんがしっかり JavaScript のコード補完もしてくれます。とはいえ、万能というわけではなくて、「WinJS.Promise のような非同期コールバックに IntelliSense を提供する方法 - ひだまりソケットは壊れない」に書いたように XML ドキュメントコメントをちゃんと書く必要があったり、XML ドキュメントコメントを書いても IntelliSense が効かないこともあったりします *4。

なので、コード補完のことだけを考えれば C# をオススメしたいところです。また、リファクタリングする際は静的型付けである方が有利ですし、テストを書くのも C# の方が楽そう *5 ですし、そういった点でも C# の方が良いかと思います。しかしながら、web 系の企業であれば、ノウハウ的にもコード資産的にも JS の方に分があると思いますし、C# を書ける人より JS を書ける人の方が多いはずですので、そういった点を考慮すると JS の方が良い場合もあると思います。

どっちがいいかとは一概には言えないので、状況次第だと思います。 (私の C# 力は、簡単な Windows フォームアプリケーションを作ったことがある程度なので参考程度にしてください。)

jQuery などの JavaScript のライブラリを使うべきかどうか

jQuery などの JavaScript のライブラリは、必要に応じて使っていけばよいと思います。 Windows ストアアプリ「はてなブックマーク」の開発では jQuery などのライブラリは使っていませんが、それは今のところ必要がないからです。

navigator.js が含まれる Visual Studio のプロジェクトテンプレート *6 を使ってプロジェクトを作成すると、ページ遷移の際に自動的にアニメーションするようになっていますし、スタート画面のようにタイル状に要素を並べたい場合などは WinJS.UI.ListView を使えば簡単に実現できます。そこらへんの機能だけを使ってアプリを開発するのであれば jQuery は不要だと思います。しかし、Visual Studio のプロジェクトテンプレートにとらわれずにアプリ開発するとなると、WinJS の機能では不十分だったり、WinJS の機能を調べるのに時間がかかって効率的でなかったりするので、そういう場合は jQuery やお好みのライブラリをばんばん使っていけばよいと思います。