お客様が developerWorks に初めてサインインすると、プロフィールが作成されます。プロフィールで選択した情報は公開されますが、いつでもその情報を編集できます。お客様の姓名（非表示設定にしていない限り）とディスプレイ・ネームは、投稿するコンテンツと一緒に表示されます。

送信されたすべての情報は安全です。

developerWorks に初めてサインインするとプロフィールが作成されますので、その際にディスプレイ・ネームを選択する必要があります。ディスプレイ・ネームは、お客様が developerWorks に投稿するコンテンツと一緒に表示されます。

ディスプレイ・ネームは、3文字から31文字の範囲で指定し、かつ developerWorks コミュニティーでユニークである必要があります。また、プライバシー上の理由でお客様の電子メール・アドレスは使用しないでください。

送信されたすべての情報は安全です。

My developerWorks：

通知：

サイン・アウト

言語を選択する：

Jo と PhoneGap を使用してネイティブ・モバイル・アプリケーションを作成する

HTML コードと JavaScript コードで Android アプリケーションを作成する

Brice Mason, Senior Web Developer, Equip For Quality

Brice Mason はニューヨーク州アップステート地域に住んでおり、夫でもあり、父でもあります。彼は EQUIP For Quality の開発者でもあり、そこで長期療養医療業界用の次世代ヘルスケア分析ソフトウェアの開発チームに所属しています。彼は http://www.bricemason.com という個人的なサイトを持っています。

概要： モバイル・アプリケーション開発の分野は急速に進歩しています。その理由の 1 つとして、新しいフレームワークが登場しており、従来からの Web 開発者にとってもモバイル開発が容易で取りかかりやすいものになってきたことが挙げられます。この記事ではネイティブ・モバイル・アプリケーションの開発について、皆さんが既に持っている HTML、CSS、JavaScript などの言語のスキルを 2 つのフレームワークに活用する方法に焦点を絞って説明します。1 つは Jo という新しいフレームワークであり、もう 1 つは PhoneGap というオープンソースのフレームワークです。PhoneGap を使用すると、よく使われているモバイル・プラットフォームのネイティブ機能を利用することができます。

タグを付ける!

日付： 2011年 3月 01日
レベル： 中級
この記事の原文： 英語
アクティビティー： 7138 ビュー
お気軽にご意見・ご感想をお寄せください：

モバイル Web か、それともモバイル・アプリケーションか

モバイル・アプリケーションの開発は、基本的に Web アプリケーション開発とネイティブ・アプリケーション開発の 2 つに分けることができます。モバイル Web アプリケーションの開発は従来の Web 開発と非常によく似ていますが、ターゲットはモバイル・プラットフォームです。モバイル Web アプリケーションは Web サーバーに格納されて提供され、モバイル Web ブラウザーによって利用されます。ご想像のとおり、モバイル Web ブラウザーの中で利用可能なリソースや機能は限定されています。それをネイティブ・アプリケーションの開発と比較してみましょう。ネイティブ・アプリケーションの開発では、モバイル・オペレーティング・システムのコア機能を利用することができます。つまりモバイル Web アプリケーション開発ではブラウザー内で作業を行い、一方ネイティブ・モバイル・アプリケーション開発ではモバイル・オペレーティング・システムとやり取りします。

ネイティブ・モバイル・アプリケーションの構築では、開発者にこれまでよりも多くの可能性がもたらされています。従来は、さまざまなプラットフォーム上でさまざまな言語や API (Application Programming Interface) を扱えるようにならない限り、モバイル・アプリケーションを作成することはできませんでした。それがもはや必要なくなっています。

この記事では、Jo と PhoneGap の基本的な使い方について、順を追って説明します。Jo は軽量であり、広範なプラットフォームをサポートし、他のフレームワークとの柔軟な統合が可能です。PhoneGap はネイティブ・アプリケーションを作成する上で重要です。なぜなら、PhoneGap によってモバイル・プラットフォームのリッチなコア機能をすべて利用できる一方、開発環境は HTML、CSS、JavaScript コードのままに維持できるからです。

Jo とは何か

Jo は Palm の Dave Balmer によって開発された新しいフレームワークです。Jo は HTML5 によるモバイル Web アプリケーションのための非常に軽量なフレームワークであり、広範なプラットフォーム (HP webOS、Apple iOS、Android、Symbian、さらには Mac OS®X Dashboard ウィジェットなど) をサポートしています。Jo はまだ活発に開発が行われている最中ですが、モバイル Web アプリケーション開発について学ぶには適しています。Jo は軽量で機能が豊富なため利用しやすく、Jo を利用することで開発者は重要な作業に専念することができます。

Jo では何ができるのか

この例では、Jo の重要な特徴のいくつかを示す、単純なカード・ベースのレイアウトを作成します。これらの特徴を理解しておくと、アプリケーションを作成する際に役立ちます。

最初の手順

まず、HTML5 対応の適切なブラウザーを開発環境用として準備する必要があります。Jo による開発に最適なブラウザーは Safari と Chrome の 2 つです。この 2 つのブラウザーに表示されるコンソールを操作し、スクリプトのデバッグ、ブレークポイントの設定、チェック用のデータのダンプを行います。次に、Jo のソース・コードを GitHubからダウンロードし (「参考文献」を参照)、ローカルの Web サーバーのルートに解凍します。この解凍されたディレクトリーを一般的な名前 (Jo など) にリネームします。ここで、http://localhost/jo/samples/test.html にアクセスして Jo のサンプル・ページを表示すると、図 1 のような画面になります。

図 1. Jo の Kitchen Sink Demo
Jo の Kitchen Sink Demo のスクリーンショット

これで Jo のダウンロードと解凍ができたので、Jo アプリケーションの作成を始めましょう。まず、Web ルートに index.html と application.js という 2 つのファイルを作成します。index.html ファイルにはリスト 1 のコードが含まれています。

リスト 1. サンプル・アプリケーションのトップ・ページ


<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>My First Jo App</title>
<!-- jo styles -->
<link rel="stylesheet" type="text/css" href="jo/css/jo.css" />
</head>
<body>
<!-- jo framework script -->
<script src="jo/js/jo.js"></script>

<!-- our application script -->
<script src="App.js"></script>

<script>
  // initializes jo
    jo.load();
  
  // our app initialization code
    App.init();
</script>

</body>
</html>

リスト 1 は、スクリプトやスタイルに関する記述を行って呼び出すためのトップ・ページを示しています。このページは今までに JavaScript アプリケーションを作成した経験のある人には見慣れたものかもしれません。Jo をサポートするデフォルトのスタイルは、この文書の先頭に含まれており、スクリプトは文書本体に含まれています。jo.js ファイルも読み込まれていることに注意してください。これは縮小化されていないバージョンの Jo フレームワークであり、開発用として推奨されるのはこのバージョンです。本番用にデプロイする準備が整ったら、jo_min.js ファイルを読み込みます。上記のファイルは Jo フレームワークを初期化する jo.load() と、それに続く App.init() という初期化コードを呼び出して終わっています。リスト 2 は初期化コードを示しています。

リスト 2. サンプル・アプリケーションの初期化コード


// demonstrates the javascript module pattern
var App = function() {

  // private members
     
  var init = function() {
    alert("the app is initialized");
  };
  
  
    // returns an object literal of members to be made public
  return {
    init: init
  };
}();

Jo のレイアウトを作成する

これでシェルを用意できたので、このシェルを変更し、基本的なレイアウトを Jo によって作成します (リスト 3)。このレイアウトは単純な master-detail パターンの出発点です。

リスト 3. Jo によって作成されたレイアウト


var App = function() {
  var deviceScreen;
  var mainContainer;
  var mainNavBar;
  var mainMenu;
  var cardStack;
  var menuCard;
  
  // initialization function
  var init = function() {    
    // create the main container
    mainContainer = new joContainer([
      mainNavBar = new joNavbar("My First Jo App"),
      cardStack  = new joStackScroller()
    ]).setStyle({position: "absolute", top: "0", left: "0", bottom: "0", right: "0"});
    
    // create the device screen
    deviceScreen = new joScreen(mainContainer);
    
    // hook up the nav bar with the card stack
    mainNavBar.setStack(cardStack);
    
    // create a menu card
    menuCard = new joCard([
      mainMenu = new joMenu([
        { title: "Go to form", id: "form-card" }
      ])
    ]);
    
    // add the menu card to the card stack
    cardStack.push(menuCard);
  };
  
  
  // public members
  return {
    init: init
  };
}();

いよいよ Jo の実質的な部分に入ります。まず、このアプリケーションの重要資産 (機器の画面、カード・レイアウトの管理、ナビゲーションなど) を表現する変数がいくつか定義されています。メインのレイアウトを管理するために、joContainer を作成します。joContainer には、(joNavbar として表現される) ナビゲーション・バーと、(joStackScroller オブジェクトとして表現される) カード管理メカニズムがあります。このコンテナーは機器の画面に追加され、使用可能な全スペースを使って表示されます。mainNavBar.setStack(cardStack) はカード・スタックをナビゲーション・ウィジェットにバインドするために呼び出され、これによってカード間のナビゲーションが自動管理されるようになります。最後に、メニュー (おなじみの項目リスト) を含む joCard のインスタンスが作成され、カード・スタックに追加されています。このコードが正常に実行されると、図 2 のような画面が表示されます。

図 2. Jo のレイアウトが表示された画面
Jo のレイアウトが表示された画面のスクリーンショット

高度なレイアウト手法

リストのレイアウトを構成できたら、続いて個々のカードを作成し、それらを 1 つにまとめます (リスト 4)。

リスト 4. joCache を使用した高度なレイアウト


var App = function() {
  var deviceScreen;
  var mainContainer;
  var mainNavBar;
  var mainMenu;
  var cardStack;
  var menuCard;
  
  // initialization function
  var init = function() {    
    // ... same code here as listing 3
    
    // register click handler for menu
    mainMenu.selectEvent.subscribe(function(id) {
      cardStack.push(joCache.get(id));  
    });
    
    // initialize the card cache
    initCardCache();
  };
  
  // initializes the cache used to store cards
  // this helps us only use what we need when we need it
  var initCardCache = function() {
    // create the form card
    joCache.set("form-card", function() {
      return new joCard([
        new joLabel("Name:"),
        new joInput(),
        
        new joLabel("Password:"),
        new joPasswordInput(),
        
        new joLabel("Description:"),
        new joTextarea(),
        
        new joLabel("Options:"),
        new joOption([ "Option 1", "Option 2", "Option 3" ]),
        
        new joLabel("Toggle:"),
        new joToggle(true),
        
        new joLabel("Selection:"),
        new joSelect([ "Item 1", "Item 2", "Item 3" ]),
        
        new joButton("Submit")
      ]);
    });
  };
  
  
  // public members
  return {
    init: init
  };
}();

リスト 4 には Jo で中心となる 2 つの概念が示されており、これらの概念を理解することが重要です。1 つ目の概念は、Jo のキャッシング機能を活用する、initCardCache という新しい関数を作成している部分です。キャッシュのエントリーには、ストリング ID (一意の識別子) と関数 (エントリーの値) が追加されます。この initCardCache 関数は、新たに作成された joCard を返します (この joCard は Jo フレームワークのフォーム・コントロールを使って構成されています)。リスト 4 のように joCache を使用すると、アプリケーションで詳細ビューのオブジェクトを作成する際、オブジェクトの作成を遅らせることができ、その結果パフォーマンスが高まります。2 つ目の概念は、一覧にしたカードと詳細ビューとをイベント・ハンドラーによって関連付けている点です。ある 1 つの項目がメニューから選択されると、そのメニュー項目の ID を使ってキャッシュからビューが取得されます。ここでは 1 つのビューしか定義することができませんが、このパターンは容易に拡張することができます。

「Go to form」というリスト項目をクリックすると、図 3 のような画面が表示されます。

図 3. Jo のフォーム・コントロールの例
さまざまな Jo のフォーム・コントロールを表示したサンプル・ページのスクリーンショット

画面最上部の左にある「Back」ボタンに注目してください。先ほど触れた、カード・スタックとナビゲーション・ウィジェットとをバインドした結果が、この「Back」ボタンです。今度は、この空のフォームをデータ・ソースに関連付けます。

Jo でのデータ・ソース

Jo には、WebKit SQLite や HTML5 のデータベースなどの情報ストアを管理するためのソリューションがいくつも用意されています。ただし、データを管理する上で最も単純で最も便利なクラスの 1 つは joRecord です。この joRecord をフォームとのインターフェースとして使用することができます (リスト 5)。

リスト 5. joRecord によってフォーム・データをバインドする


var App = function() {
  // ...same as listing 4
  var formRecord;
  
  // initialization function
  var init = function() {
    // ... same as listing 4
  };
  
  // initializes the cache used to store cards
  // this helps us only use what we need when we need it
  var initCardCache = function() {
    // create the form card
    joCache.set("form-card", function() {
      // initialize the persistent form record
      formRecord = new joRecord({
        name: "Nigel Bitters",
        password: "somepassword",
        description: "Some long winded description here.\nWith a line break!",
        option: 1,
        isActive: true,
        selection: 2
      });
                      
      return new joCard([
        new joLabel("Name:"),
        new joInput(formRecord.link("name")),
        
        new joLabel("Password:"),
        new joPasswordInput(formRecord.link("password")),
        
        new joLabel("Description:"),
        new joTextarea(formRecord.link("description")),
        
        new joLabel("Options:"),
        new joOption([ "Option 1", "Option 2", "Option 3" ], formRecord.link("option")),
        
        new joLabel("Toggle:"),
        new joToggle(formRecord.link("isActive")),
        
        new joLabel("Selection:"),
        new joSelect([ "Item 1", "Item 2", "Item 3" ], formRecord.link("selection")),
        
        new joButton("Submit").selectEvent.subscribe(function() {
          // dump out the modified data
          console.dir(formRecord);                            
        })
      ]);
    });
  };
  
  // public members
  return {
    init: init
  };
}();

initCardCache 関数の中で joRecord のインスタンスが作成され、その joRecord インスタンスにより、フォームの値が初期化される他、フォームへの変更も管理されます。図 4 は値がどう初期化されるかを示しています。

図 4. フォームの値の初期化
サンプル・ページのスクリーンショットとして、さまざまな Jo のフォーム・コントロールと初期値を表示した画面が表示されています。

リスト 5 のサンプルを実行してフォームのデータを変更し、「Submit」ボタンをクリックします。すると、ブラウザーのコンソールには、変更されたフォームのレコードが表示されていることがわかります。

ここまでで、実用的なモバイル Web アプリケーションを作成するための主な機能について説明しました。今度は PhoneGap を追加してネイティブ・モバイル・アプリケーションを作成する方法を検討してみましょう。

PhoneGap とは何か

PhoneGap は HTML コードと JavaScript コードによってネイティブ・モバイル・アプリケーションを作成するためのオープンソースのフレームワークです。PhoneGap により、ターゲットとなるモバイル・プラットフォームのオペレーティング・システムにユーザー・インターフェースを実装することができます。PhoneGap は、iPhone、Android、Blackberry、Symbian、Palm などのプラットフォームをサポートしています。PhoneGap によって公開されているネイティブ機能 (加速度計へのアクセス、カメラおよびメディアのサポート、連絡先、ジオロケーション、ファイル、ネットワーク、ストレージなど) は、モバイル・アプリケーションにとっても非常に価値のある機能です。

簡単な例として、Android プラットフォーム用の連絡先アプリケーションについて説明します。最初に開発環境を構成します。

これまで純粋な Web 開発しか行ったことがない人には、PhoneGap を使用可能な状態にまで準備する作業は少し尻込みしたくなるように思えるかもしれません。表 1 は PhoneGap で前提となるソフトウェア要件を示しています。

表 1. PhoneGap のソフトウェア要件

ソフトウェア	説明
Eclipse IDE (統合開発環境)	PhoneGap アプリケーションをビルド、実行します。
JDK (Java Development Kit)	Java コンパイラーとサポート・ツールが含まれています。
Android SDK (Software Development Kit)	アプリケーションの実行に必要なベース・コードとエミュレーターが含まれています。
ADT (Android Development Tools)	Eclipse 用の開発プラグインにアクセスします。
Apache Ant	プロジェクトのビルド・プロセスを管理します。
Ruby	プロジェクトの作成など、PhoneGap のさまざまなタスクを管理します。

この記事では、開発環境の構成プロセス全体については説明しません。ただし、「参考文献」には開発環境を構成するためツールをいくつか紹介してあります。まず、Android 開発者用のサイトにあるドキュメント、「Installing the SDK」の指示に従います。このドキュメントには、表 1 の最初の 4 つの要件についてのセットアップ手順が説明されています。次に、Apache Ant と Ruby をダウンロードしてインストールします。

この時点で、主なコンポーネントがすべて準備できたことになります。PhoneGap プロジェクトをロード、ビルド、実行するための IDE (Eclipse) が準備できており、またサポート・ツールもすべて準備できました。いくつかの構成作業を行い、構成を完了します。

ビルド・プロセスでは、システム上に定義されている環境変数をいくつか使用します。これらの変数について、表 2 に示します。

表 2. 環境変数

変数	説明
`ANDROID_HOME`	コンピューター上で Android SDK がインストールされているディレクトリーのルートを指します。
`ANT_HOME`	コンピューター上で Apache Ant がインストールされているディレクトリーのルートを指します。
`JAVA_HOME`	コンピューター上で JDK がインストールされているディレクトリーのルートを指します。
`PATH`	Ruby、Ant、JDK の bin フォルダーへのパスと、Android SDK がインストールされているディレクトリーの tools フォルダーへのパスを定義します。

最後に、Eclipse で AVD (Android Virtual Device) を定義します。AVD は Android を使用する実際の機器をモデリングする一連の構成オプションであり、Android エミュレーター上で PhoneGap アプリケーションを実行する上で不可欠です。AVD を作成するためには、Eclipse を開き、「Window (ウィンドウ)」 > 「Android SDK and AVD Manager (Android SDK および AVD マネージャー)」の順にナビゲートします。すると図 5 のような画面が表示されるはずです。

図 5. Android SDK and AVD Manager (Android SDK および AVD マネージャー) の画面

Android SDK and AVD Manager (Android SDK および AVD マネージャー) の画面のスクリーンショット

左側のメニューにある「Virtual Devices (仮想デバイス)」という項目を選択し、「New… (新規…)」ボタンをクリックします。図 6 のように情報を入力し、「Create AVD (AVD を作成)」をクリックします。「Android SDK and AVD Manager (Android SDK および AVD マネージャー)」を閉じると、PhoneGap プロジェクトをロード、ビルド、実行する準備が整ったことになります。

図 6. 「Create new Android Virtual Device (AVD) (新規 AVD (Android Virtual Device) を作成)」の画面

「Create new Android Virtual Device (AVD) (新規 AVD (Android Virtual Device) を作成)」の画面のスクリーンショット

サンプルの PhoneGap プロジェクトを実行する

PhoneGap 用の開発環境の構成は複雑なプロセスですが、それに比べればプロジェクトのロードははるかに簡単です。初めての PhoneGap アプリケーションを実行するためには、GitHub から phonegap-android プロジェクトの最新パッケージを皆さんのコンピューターにダウンロードして解凍します (「参考文献」を参照)。次にコマンド・プロンプトを開いて、PhoneGap をインストールしたディレクトリーのルートにディレクトリーを変更し、リスト 6 に示すコマンドを実行します。

リスト 6. PhoneGap プロジェクトを作成するためのコマンド


./bin/droidgap create example

このコマンドにより、example フォルダーの Web ソース・ファイルから Android プロジェクトが作成されます。このプロジェクトを Eclipse にロードするには、「File (ファイル)」 > 「New (新規)」 > 「Project… (プロジェクト…)」の順にナビゲートし、表示されるウィンドウで「Android」フォルダーを展開し、「Android Project (Android プロジェクト)」を選択し、「Next > (次へ >)」をクリックします。このプロジェクトを図 7 のように構成し、「Finish (完了)」をクリックします。

図 7. プロジェクトの設定画面のスクリーンショット

ソースのある場所は、PhoneGap をインストールしたディレクトリーの example_android というフォルダーです。droidgap コマンドによってプロジェクトのファイルが作成された場所がこのフォルダーになります。これで Eclipse のパッケージ・エクスプローラーにプロジェクトがロードされたので、このプロジェクトの「libs」フォルダーを展開して「phonegap.jar」ファイルを右クリックし、表示されるコンテキスト・メニューから「Build Path (ビルド・パス)」 > 「Add to Build Path (ビルド・パスに追加)」の順に選択します (図 8)。

図 8. ビルド・パスに phonegap.jar を追加する
ビルド・パスに phonegap.jar を追加するためのメニュー・パスを示すスクリーンショット

このアプリケーションを Android アプリケーションとして Eclipse で実行すると、図 9 のような画面が表示されるはずです。

図 9. PhoneGap のサンプル・アプリケーションが Android エミュレーターで実行されている様子

PhoneGap のサンプル・アプリケーションが Android エミュレーターで実行されている様子を示すスクリーンショット

PhoneGap に Jo を追加する

既にお気付きかもしれませんが、PhoneGap をセットアップして立ち上げるにはいくつものステップが必要です。それでも、PhoneGap フレームワークの操作方法は最近の他の JavaScript フレームワークと変わりません。ここまでで Eclipse を利用して Android 用の PhoneGap アプリケーションを作成、ビルド、実行できるようになったので、ユーザー・インターフェースの操作用に Jo を追加するのも簡単です。実際、Jo のウィキ・サイトには、推奨の構成を含んだサンプルのインデックス・ファイルが用意されています (リスト 7)。

リスト 7. PhoneGap とやり取りするためのトップ・ページのコード・サンプル


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>My App</title>

    <!-- stylesheets -->
    <link rel="stylesheet" href="css/aluminum.css" type="text/css">
    <link rel="stylesheet" href="css/chrome.css" type="text/css">
    <link rel="stylesheet" href="css/myapp.css" type="text/css">
</head>
<body>

<!-- lib -->
<script src="phonegap.js"></script>
<script src="js/jo_min.js"></script>

<!-- app -->
<script src="js/myapp.js"></script>

<script>
    jo.load();
    joEvent.touchy = true;
    MyApp.load();
</script>

</body>
</html>

リスト 7 が見慣れた形式に見えるのは、この文書の先頭にスタイルシートが含まれているためです。この文書の本体には、最初にフレームワーク用のスクリプトが組み込まれており、続いてアプリケーションのスクリプト・ファイルがあります。皆さんが初めて目にする行は、joEvent.touchy = true です。このプロパティーにより、マウス・ベースの関連イベントはすべて、モバイル機器上で使用されるタッチ・イベントに変換されます。

まとめ

Jo と PhoneGap とを組み合わせることで多くのことを実現できますが、Jo に PhoneGap が必要なわけではなく、PhoneGap に Jo が必要なわけでもないことを忘れないでください。Jo と PhoneGap は、それぞれ単独で使用することも、他のフレームワークと共に使用することもできますが、Jo の単純さと軽量さを PhoneGap の強力さと組み合わせると効果的なツールとなり、広範なプラットフォームを対象とするリッチなモバイル・ネイティブ・アプリケーションの開発に活用できるようになります。

参考文献

学ぶために

Getting started with Android PhoneGap in Eclipse を訪れ、Android プラットフォームで構成を行う場合の一般的な問題に対するソリューションを見つけてください。
初めて SDK をインストールする場合の方法と、環境をセットアップするための方法を学んでください。
developerWorks の Web development ゾーンには、さまざまな Web ベースのソリューションを解説した記事が豊富に用意されています。

製品や技術を入手するために

Jo HTML5 Mobile App Framework のソース・コードをダウンロードし、ドキュメントを読み、サポート・フォーラムに参加してください。
PhoneGap のソース・コードをダウンロードし、ドキュメントを読み、コミュニティーとやり取りしてください。
GitHub から Jo のソース・コードをダウンロードしてください。
初めての PhoneGap アプリケーションを実行するために、GitHub から phonegap-android プロジェクトの最新パッケージを皆さんのコンピューターにダウンロードして解凍してください。
Eclipse IDE は Android アプリケーションの開発をサポートするオープンソースの IDE です。
Android SDK を使用して、Android アプリケーションの開発をサポートするライブラリーとツールをダウンロードしてください。
Apache Ant はソフトウェア開発でファイルをビルドするための Java ライブラリーであり、コマンドライン・ツールです。
Ruby 言語と Ruby 環境を含んだ、Windows マシン用のインストーラーをダウンロードしてください。
Eclipse 用の ADT プラグインをインストールすると、Android プロジェクト開発をサポートすることができます。