ツール、言語を含む開発技術で“Openness”へと大きく舵を切る
「GrapeCity ECHO Tokyo 2016」の幕を切って落とす講演には、日本マイクロソフト デベロッパー エバンジェリズム統括本部 エバンジェリストの井上章氏が登壇した。マイクロソフトの技術的取り組みにおいて、近年、顕著な傾向となっているのが“Openness”への指向の高まりだ。言うまでもなく、その中核となっているのがオープンソースへのコミットメントである。
例えば、今回のイベントにおけるキーワードの一つである「TypeScript」。JavaScriptのスーパーセットとなるこの言語は、C#のリードアーキテクトとしても知られる同社のアンダース・ヘルスバーグ氏を中心に開発された。静的型付けとクラスベースのオブジェクト指向の採用がその大きな特徴となっている。
TypeScriptで記述されたソースをコンパイルすると、JavaScriptのコードが生成されることになるが、マイクロソフトでは、そのコンパイラ（TSC）のソースコードをGitHub上で公開している。そのほかにも、マイクロソフトが.NET Frameworkや.NETのコンパイラ、ランタイムなどのオープンソース化を表明していることは周知の通りである。
加えて、同社のそうした“Openness”への指向を強烈に印象づけているのが、無償提供されている開発エディタ製品「Visual Studio Code」だ。このツール自体がオープンソースであることに加え、Windowsだけでなく、Mac OS XやLinuxの環境でも動作可能となっている。コードエディタを中心に、IntelliSenseやコードの整形、文法チェック（Lint）、ブレークポイントの設定やステップ実行など、その搭載する開発支援機能も非常に充実しており、GoogleがTypeScriptベースで構築を進める「Angular 2」の開発においても、多くの技術者がこのVisual Studio Codeを活用しているとのことだ。
高い親和性を持つWijmoが、Angular 2による開発を強力に支援
続くセッションには、グレープシティ Wijmo開発プログラムマネージャー アレックス・イワネンコ氏が壇上に登場。Googleの提供する次世代開発フレームワークとして注目されるAngular 2とグレープシティのUIコントロール製品「Wijmo」のインテグレーションについて解説した。
WijmoにおけるAngular 2サポートを望むユーザーの声は、すでにAngular 2がアルファ版の段階からグレープシティに届いていたという。これに対し同社では、Googleの協力を得て、Angular 2がベータ版のフェーズに移行したタイミングで、Wijmoにおけるサポートをスタートさせている。
「当初のサポートは本格的なものとはいえませんでしたが、その後多くの開発者の方々が、Angular 2によるビジネスアプリケーション開発にWijmoを利用。Angular 2がリリース直前のRC（Release Candidate）版となっている現段階では、すでに開発を終了しているというお客様も多く見られます。まだプラットフォームとして正式にリリースされていないにもかかわらず、本番環境でお使いのお客様がこれだけ増えているという状況は、非常に珍しいことだと感じています」とイワネンコ氏は語る。
Angular 2のアプリケーションでは、アプリケーションコンポーネント、ビューコンポーネント、UIコントロールコンポーネントといったコンポーネントで構成されることがその特徴となっている。コンポーネントには、大きくは2つの要素が含まれ、一つはTypeScriptのクラスで、これはアプリケーションの挙動やランタイムAPIを定義するもの。もう一つは、HTMLのテンプレートであり、こちらはアプリケーションのルック＆フィールの“ルック”の部分を定義し、画面上でページをどのように見せるかを決めるものだ。「要するにAngular 2のコンポーネントは、これらTypeScriptのクラスとテンプレートを組み合わせるかたちで、プロパティやイベントのバインディングを行いながら動作することになります」とイワネンコ氏は解説する。
一方、Wijmoのライブラリは、複数のUIコントロールセットで成り立っている。ピュアなJavaScriptで実装されており、jQueryなどを含むライブラリへの依存性もない。また、TypeScriptで記述されていることも、その大きな特徴となっている。「Angular 2自体もTypeScriptで記述されているので、Wijmoとの間には高い親和性があり、インテグレーションも非常にやりやすくなっています」とイワネンコ氏は説明する。
これに関しWijmoでは、「Wijmo Angular 2 interop（相互運用モジュール）」を用意している。例えば、Wijmoライブラリにはユーザーから日付情報を収集する「InputDate」というコントロールが含まれているが、相互運用モジュールではそれに対応する「WjInputDate」というディレクティブを用意。その利用により、Angular 2のアプリケーションにWijmoのInputDateコントロールを追加することができるわけだ。このようにWijmoにおいては、Angular 2のアプリケーションでWijmoの全コントロールを追加し、双方向を含むバインディングを行うための仕組みを提供している。このときWijmoでは、パフォーマンス重視の設計がなされており、Angular 2アプリケーションにおいても、コードのオーバーヘッドを最小限に抑えながら、サイズ的にも軽量で高速なコンポーネントの実装が可能となっている。
「今後、Angular 2は、エンタープライズシステム開発向けの強固な基盤となっていくことは間違いありません。特にTypeScriptというモダンなオブジェクト指向言語を用いていることはその大きなメリット。高い親和性を備えるWijmoが、Angular 2によるアプリケーション開発を強力に支援していくことになります」とイワネンコ氏は語る。
ビルドに自動テストを組み込み、開発効率向上と品質担保を図る
引き続き実施されたこの日3つめの講演には、グレープシティ Wijmoグローバルプロダクトマネージャー クリス・バノン氏が登壇。このセッションは、グレープシティ自身がWijmoをどのように開発しているかという、いわば“開発裏話”的な趣を持つものとなった。
Wijmoは、JavaScriptベースのコントロール製品で、データグリッドやチャートなどのUIの領域に特化しながら、パフォーマンス重視の設計で、コア機能を軽量サイズで提供。豊富な追加機能がオプションの拡張モジュールのかたちで提供されており、ユーザーは必要に応じて選択できるようになっている。
こうしたWijmoの開発チームは、米国、ブラジル、カナダ、中国、インド、ミャンマー、そして日本といった世界各国の拠点に分散。その開発には、Visual Basicの時代からおよそ25年もの長きにわたりコントロール製品の提供に取り組んできた、グレープシティの豊かな経験とノウハウが十二分に投入されている。
「最新版のWijmo 5は、“真のJavaScriptコントロール”と呼ぶべきもの。一般にJavaScriptで記述されたコンポーネントは、通常、ウィジェットのかたちが採用されますが、Wijmo 5では、まさに.NETのコントロールと同様、クラスとして実装することが可能となっています」とバノン氏は強調する。
Wijmoの開発においては、まずコーディングに関して、Visual Studio（Team Foundation Server）上でTypeScriptによって記述している。また、デザインツールとしてはCSSプリプロセッサである「Less」、およびモバイル端末に対応したUIフレームワーク「Bootstrap」を利用。そして自動テストには、JavaScript用のユニットテストフレームワークである「QUnit」とブラウザオートメーションツール「Selenium」をそれぞれ採用する一方、マニュアルテストにはWebブラウザ開発ツールと、Webベースのクロスデバイステストが可能な「BrowserStack」を利用している。
「Visual Studio上での開発において、Wijmoのコントロールライブラリのプロジェクトは、標準のVisual Studio Projectとほぼイコールのかたちで、.NETのコントロールライブラリのプロジェクトと何ら変わりのない感覚で進めていけるようにしています。またサンプルアプリケーションのセットアップについても、.NETのものとほとんど同じ。各サンプルにはVisual Studioのソリューション、プロジェクトを用いており、サンプルアプリケーションの実行時には、Wijmoのソースがコンパイルされ、デバッグが行えるようになっています」（バノン氏）。
次にビルドプロセスについてだが、開発者はすでに述べたVisual Studio Team Foundation Server（TFS）上にソリューション、プロジェクトファイル、TypeScript、Less CSSのファイルなど各種ソースコードを格納し、管理している。それらソースコードのビルドについては、MSBuildを用いた複数のビルドサーバーを用意。そこで実行されるビルドプロセスには、QUnitとSeleniumによる自動テストが組み込まれるかたちとなっている。
仮に自動テストで不合格になると、コードのどこにバグがあったのかといった内容がTFSにフィードバックされ、テスト不合格の旨と合わせて開発者に通知されることになる。このような一連のプロセスをグレープシティでは毎日夜、『ナイトリービルド』というかたちで実施。常にコードの健全性を担保すべく、チェックを繰り返し行っているのである。
また、ほぼ月次で実施されるリリース直前のビルドプロセスには、自動テスト通過後のフェーズにテスト担当者によるQAテストが追加される。そこで不具合が発見された場合にも、前述の自動テストの際と同様に関連情報が開発者に報告されることになり、コード修正と自動／マニュアルテストを含む一連のビルドプロセスを繰り返し行って、問題が完全に除去された後、晴れてソフトウェアの新版がリリースの運びとなるわけだ。
「大規模なJavaScriptアプリケーションの構築に当たる開発者の皆様にぜひ推奨したいのが、プロセスにオートメーションテストも組み込んで、ぜひビルドの自動化を進めていただきたいということ。そのことが、開発効率の向上はもちろん、ソフトウェア品質の担保にも大きく貢献するはずです」とバノン氏は強調する。
Wijmoの積極的な活用により、こだわりのUIをアプリに実装
続く4つめのセッションには、弥生 開発本部 システム開発部 シニアテクニカルリーダーの久保智也氏が登壇。自社におけるWijmoを活用したアプリケーション開発の事例を紹介した。
会計・販売・給与といった業務用パッケージソフトの提供で知られる弥生だが、最近ではクラウドの領域にも参入。「弥生会計オンライン」をはじめ、パッケージが装備する各種業務機能をサービスとして提供している。同社では、これらクラウドサービスの開発にWijmoを採用。「FlexGrid」や「Input」といったコントロールを活用し、サービスの画面UIの構築に役立てている。
特に利便性に優れたユーザーフレンドリーな操作感にこだわる同社では、Wijmoのコントロールを独自に拡張。例えば、数値入力コントロールに電卓機能を付加したり、コンボボックスにドロップダウン機能を追加したりといった具合だ。
もっとも標準コントロールにこうしたカスタマイズを施すと、Wijmoのコントロールがバージョンアップされる都度、差分を埋める作業が発生するといった問題が発生する。そこで同社では、Wijmoで提供されるコントロールそのものではなく、継承したコントロールにカスタマイズを行うという工夫により問題を解消している。
現在、Wijmo 3から最新のWijmo 5への移行を進める同社では、新版ではそうしたカスタマイズがさらにやりやすくなるものとして、期待をふくらませているところだという。
そして、この日最後の講演の壇上には、日本マイクロソフト Dynamics ビジネス統轄本部 プリンシパルテクノロジーストラテジスト 西澤貴志氏が上った。
「Microsoft Dynamics CRM」は、顧客管理、商談管理といった、CRM（Customer Relationship Management）の基盤として多くの企業に採用されていることで知られるが、その柔軟なアーキテクチャから、企業のニーズを満たす「簡易業務アプリケーション基盤」としても活用可能だ。例えば、大学であれば学生管理、不動産会社であれば物件管理といった具合に、CRMならぬ“XRM”に対応したアプリケーションを高生産性により開発することができる。
構築されたアプリケーションは、PCからWebブラウザを介して利用できることはもちろん、タッチフレンドリーなUIを採用したモバイル端末用クライアントアプリも標準装備。マイクロソフトでは、その画面構築にWijmoを採用している。まさに「いつでも」「どこでも」「どこからでも」利用が可能なDynamics CRMの利便性に優れた柔軟な使い勝手をWijmoが支えているわけだ。
今回の「GrapeCity ECHO Tokyo 2016」の会場となった東京 品川にある日本マイクロソフトのセミナールームには、数多くの開発者が詰めかけ、プログラムはその熱気のなかで消化されていった。参加者には、今後のWebアプリケーション開発を考えるうえでの、さまざまな“気づき”がもたらされたはずだ。
