Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

TypeScript、Angular 2がエンタープライズアプリケーション開発を変革 ~ 「GrapeCity ECHO Tokyo 2016」開催

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
2016/08/24 14:00

目次

ビルドに自動テストを組み込み、開発効率向上と品質担保を図る

 引き続き実施されたこの日3つめの講演には、グレープシティ Wijmoグローバルプロダクトマネージャー クリス・バノン氏が登壇。このセッションは、グレープシティ自身がWijmoをどのように開発しているかという、いわば“開発裏話”的な趣を持つものとなった。

グレープシティ株式会社 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アプリケーション開発を考えるうえでの、さまざまな“気づき”がもたらされたはずだ。



  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • 丸谷 潔(マルタニ キヨシ)

     フリーランスライター。1963年生まれ。慶應義塾大学文学部卒。システム開発(メインフレーム、OS/2等)、IT関連雑誌・書籍の編集を経て現職。執筆領域はIT系全般、FA系など。

バックナンバー

連載:「GrapeCity ECHO Tokyo」レポート
All contents copyright © 2005-2019 Shoeisha Co., Ltd. All rights reserved. ver.1.5