Tools for Apache Cordova で iOS 向けのアプリケーションを開発する

開発者の皆様の多くは、Xamarin や C++ を使って iOS 開発をした経験があるのではないでしょうか? 実は Visual Studio 2015 でも、JavaScript を使用して iOS、Android、Windows 向けのアプリをすばやく簡単に構築することができます。Tools for Apache Cordova (英語) は、短期間での市場投入、保守性、コードの再利用を重視するプロジェクトに最適なツールです。Apache Cordova (英語) の Web 標準に基づくアプローチと、柔軟性の高いプラグインモデルを活用することで、成長を続ける大規模なクライアント側の Web 開発に気軽に参加できるようになっています。オープン ソースのリソースはスタックのすべての階層で充実しています。Cordova のプラグインからネイティブ API にアクセスすることも、AngularJS (英語)、Ionic (英語)、Onsen UI (英語) などの Web フレームワークからアクセスすることもできます。また、Cordova のビルド システムは Node.js (英語) を基盤としているため、人気の高いタスク実行プログラムの Gulp (英語) など、近年増え続けている Node.js ベースのコマンド ライン ツールを簡単に活用することができます。その結果、Web 機能とネイティブ機能の最も良い部分を組み合わせて活用し、プラットフォームに依存しない、汎用性のある、さらに高いレベルのアプリを生み出すことができるようになっています。

Apache Cordova での iOS アプリ開発に必要な開発者エクスペリエンス全般を強化するために、マイクロソフトはこの 1 年間を通してさまざまな取り組みを進めてきました。今回の記事では、既に提供を開始しているいくつかの優れた機能の概要と、今後数か月のうちに予定している主な機能強化についてご説明します。

Ionic および Monaca のテンプレート

高い評価を受けているアプリには、必ず優秀な UI が使用されています。先日のブログ記事で、Monaca (英語) と Ionic (英語) の 2 つの UI フレームワークが現在人気を集めているとお伝えしましたが、これらを使用することによって、Web ベースのモバイル アプリをさらに高いレベルへと手軽に進化させることができます。Monaca や Ionic でアプリを構築すると、iOS での見栄えや操作性も良くなります。中でも優れているのは、Monaca Onsen UI の強力なテーマ機能と、Ionic の SASS を基盤とするテーマ機能 (英語) です。これらの機能によって、アプリに iOS のデザインを使用することも、プラットフォームに依存しない自社ブランドのデザインを使用することもできます。

そして今回、Ionic (英語) および Monaca Onsen UI (英語) 向けの Visual Studio テンプレートが公開されました。これらのテンプレートを使用することで、アプリをよりすばやく構築して実行できるようになっています。

Visual Studio での iOS アプリの構築とデバッグ

Tools for Apache Cordova では OSX で実行されるリモート エージェントを使用して、iOS 版アプリの構築、シミュレーション、実行、デバッグを Visual Studio から直接行うことができます。このエージェントをコンピューターにインストールすることで、MacInCloud の従量課金制プランや管理型プラン (英語) を使用したり、MacInCloud (英語) や MacStadium (英語) の専用クラウド機能を使用したりすることができます。これらのクラウド機能では、iOS のビルドだけでなく、Xcode や、iOS Simulator などの iOS の開発に必要なすべてのツールにアクセスすることが可能なほか、署名証明書へのアクセスや発行、Application Loader を使用したアプリの公開などもできるため、Mac をまったく使用せずに済むというメリットがあります。

OSX マシンでリモート エージェントのインストールと構成が完了したら、Visual Studio で「Remote Device」または「Simulator -*」のいずれかをデバッグ対象として選択すると、自動的にビルド、デプロイ、起動を実行することができます。さらに、JavaScript Debugger、DOM Explorer、JavaScript Console を実行中のアプリにアタッチすることもできます。このエージェントはアプリのビルドに適した Cordova のバージョンを自動的に取得するため、バージョンを変更してもユーザーが追加の操作をする必要はありません。その後は、実行中の DOM の調査や編集、レイアウトの診断、各要素に対応する CSS ルールのトレース、コード内でのブレークポイントの設定、JavaScript の式の評価、console.* メッセージの表示など、さまざまな作業を行うことができます。

iOS と Visual Studio Online

Tools for Apache Cordova は、チームが使用するさまざまなビルド システムや CI システムに対応するように設計されています。これは、これらのチームが Apache Cordova コマンド ライン インターフェイス (CLI) (英語) を標準としてプロジェクトを作成するためです。Team Foundation Services (TFS) 2015 では、OSX 上で直接ビルドを実行できる新しいクロス プラットフォーム エージェント (英語) が導入され、これにより TFS と Visual Studio Online (VSO) で初めて、Cordova を使用した iOS アプリの構築と、ネイティブな Xcode プロジェクトがサポートされました。

VSO のクロス プラットフォーム エージェントは Node.js (英語) を基盤としており、単純な HTTPS 接続で TFS 2015 サーバーや Visual Studio Online に接続して作業を取得します。そのため、OSX マシンは TFS や VSO のインスタンスに HTTP 接続でアクセスする必要がありますが、逆方向の接続は必要ないためセットアップや構成が非常にシンプルになります。また、ご自身が所有する内部ネットワークの専用機能である MacInCloud (英語) や MacStadium (英語) を、追加のネットワーク構成を行わずに直接 Visual Studio Online と統合することができます。

さらに、[BUILD.PREVIEW] メニュー オプションをクリックするだけで、お手持ちの Mac ハードウェア、専用機能の MacInCloud (英語) や MacStadium (英語)、その他のホスティング プロバイダーなどでエージェントを起動して、これらのクロス プラットフォーム機能や iOS ビルド機能を Visual Studio Online で試すことができます。

この機会に VSO にサインアップして、TFS 2015 および VSO のチュートリアル (英語) で詳細をご確認いただき、ここでご紹介した新機能を Visual Studio 2015 Cordova プロジェクトのセットアップや実行にご利用ください。また、今後数か月以内にさらに最適化された手法を公開する予定なので、そちらもご期待ください。

マイクロソフトのアプリと開発者向けサービス

マイクロソフトは、iOS 向けの機能として、IDE や VSO の機能のほかにも多数のアプリや開発者向けサービスをご用意しています。

Microsoft Intune

ここまでは、Visual Studio Online で iOS アプリを開発するための機能について説明してきましたが、ここでは、開発したアプリの社内展開と管理のためのソリューションである Microsoft Intune をご紹介します。

包括的なモバイル デバイス管理ソリューションである Microsoft Intune は、iOS、Android、Windows、Windows Phone といった従業員の各デバイスを企業環境で管理することを想定して設計されています。iOS デバイスの管理機能に完全に対応しているだけでなく、従業員向けのセルフサービス型社内アプリ ストアの利用や、iOS デバイスでのアプリの管理や制限も可能です。つまり、Microsoft Intune では、Tools for Apache Cordova で作成したアプリをアップロードして、任意の管理対象デバイスにそのアプリを展開することができます。

また、現在モバイル アプリケーション管理機能の機能強化が進められており、アプリごとにさらにきめ細かくセキュリティを管理できるようになりました。既に iOS 向けのアプリ ラッピング ツールもリリースされており、これから数か月でさらに魅力的な機能が追加される予定です。

マイクロソフトのアプリサービス

マイクロソフトは、開発者がアプリをより迅速に作成するために使用できる強力なサービスを多数提供しています。これらのサービスはマイクロソフトのデバイス以外でも使用することができます。たとえば、iOS を対象とした Apache Cordova プロジェクトでは、マイクロソフトが開発に携わった各種 Cordova プラグインを使用することで、これらのサービスを活用できます。

以下は、現在ご利用いただけるマイクロソフト サービス関連のプラグインの一部です。

• Azure Mobile Services: Azure チームから iOS 完全対応の Azure Mobile Services プラグイン (英語) がリリースされています。このプラグインを使用すると、プロジェクト上で右クリックして [Add]、[Connected Service…] の順に選択するだけで、アプリを簡単に Visual Studio から構成できます。
• Active Directory: Active Directory チームから Cordova 5.0.0 向けの ADAL (英語) と AD Graph (英語) のプラグインがリリースされています。これらを使用すると、ネイティブ iOS ライブラリ (英語) から簡単に Active Directory を使用できます。
• Office 365: Cordova 向けの Outlook サービス (英語) とファイル/検索サービス (英語) のプラグインがリリースされています。これらを使用することで、アプリで単一の JavaScript コード ベースを使用して iOS やその他のプラットフォームから、Outlook サービスまたはファイル/検索サービスを使用することができます。
• Application Insights: Application Insights チームから Application Insights プラグイン (英語) がリリースされています。これを使用すると、Cordova アプリから使用状況のデータを収集し分析することができます。

一部のプラグインはまだ開発ライフサイクルの初期段階にありますが、マイクロソフトはオープン ソース プロジェクトと Apache Cordova コミュニティに対して今後も継続的に投資を行っていくことにしています。エンジニアリングチームでは、Cordova の迅速性と安定性の強化のほか、重要なアプリや開発者向けサービスへの簡単な接続を可能にするための作業を行っています。

コマンドラインの相互運用と Visual Studio Code

マイクロソフトでは、Visual Studio 2015 の「コマンド ラインの相互運用」の実現に向けて取り組みを進めてきました。コマンド ラインを相互運用できれば、開発チームが Mac と Windows の両方を使用している場合でも、同じ Cordova プロジェクトを各自が使用しているコード エディターで開いて編集することができます。これには、適切なバージョンの Apache Cordova コマンド ライン インターフェイス (CLI) (英語) をインストールします。これで、プロジェクトのソース コードを Git リポジトリから取得して、OSX でアプリの構築を継続することができます。Visual Studio 独自の機能を使用できるように、Cordova プラグイン (英語) も開発しました。これから数か月でさらに機能を追加する予定です。

簡単にまとめると、Visual Studio と Visual Studio Code (英語) を使用することによって、チーム内で Windows と OSX の開発を行っている各メンバーが同じコード ベースを開発できるようになったということです。Visual Studio と Visual Studio Code の間でファイル システムが直接反映されるため、[File]、[Open Folder] の順に選択して Cordova プロジェクトのフォルダーを指定すれば、Visual Studio Code で Cordova プロジェクトを編集できます。また、Visual Studio Code を使用しているときに、Visual Studio 内から強力なタスク実行プログラムである Gulp (英語) とその関連のプラグイン (英語) の両方を、Task Runner Explorer を利用してまたはコマンド ライン経由で使用することができます。

iOS の場合、OSX でプロジェクトを編集できるようになるため、所有する Mac またはクラウドベース サービスを利用して、Xcode の platforms/ios フォルダーに存在する Cordova CLI の cordova prepare ios コマンドで生成されたネイティブな iOS プロジェクトを開いて、特に厄介な問題のトラブルシューティングを行えるようになります。そしてその後、Cordova CLI やその他のコマンド ライン ツールを使用して編集や構築を行い、変更をソース管理にコミットすることができます。Visual Studio や Windows を使用している場合は、準備ができたら、他の操作を行うことなく変更をプルダウンできます。

今後数か月のうちにさらなる機能強化を予定していますので、そちらもどうぞお楽しみに。

まとめ

2014 年 6 月の TechEd で Tools for Apache Cordova の Technology Preview を発表して以来、開発チームにとっては忙しい 1 年間となりました。Visual Studio 2015 では、早期に導入していただいたお客様や、Visual Studio や Cordova のコミュニティの皆様から数多くの貴重なフィードバックをいただきました。こうした皆様の支えにより、Visual Studio 2015 を正式にリリースさせていただくことができました。本当にありがとうございます! 今回ご紹介した iOS 関連機能もぜひご活用いただければ幸いです。今後もどんどん新機能をリリースしていきますので、どうぞご期待ください。

まだ Tools for Apache Cordova を試されたことのない方は、こちらから Visual Studio 2015 の Community または Enterprise RC をダウンロードして、[Tools for Apache Cordova] オプションを有効にした状態でインストールしてください。

マイクロソフトは皆様からのフィードバックをお待ちしております。UserVoice (英語)、Send-a-Smile (英語)、Twitter、StackOverflow (英語)、またはメールにてお気軽にご意見やご感想をお寄せください。ドキュメントの作成にご協力いただける方は、こちらのブログ記事をご確認ください。

マイクロソフトによる iOS サポートの詳細については、C++ チーム ブログ (英語)、Visual Studio Code チーム ブログ (英語)、Visual Studio Online チーム ブログ (英語)、およびこちらの Web サイト (英語)をご覧ください。