前回は、Monaca Localkitを使用するための基礎知識について説明しました。今回は、Monaca Localkitの基本的な開発手順について説明していきたいと思います。

Monaca Localkitでの基本的なアプリ開発の流れは、以下になります。

  • Monaca LocalkitにMonacaプロジェクトを登録する。
  • アプリ設定を行う。
  • Cordovaプラグインの設定を行う。（Cordovaプラグインが必要な場合）
  • エディターでコーディングを行う。
  • Monacaデバッガーを使用して動作確認を行う。
  • デバッグビルドしたアプリで動作確認を行う。

Monaca Localkitにプロジェクトを登録する

Monaca Localkitにプロジェクトを登録する場合は、ファイルメニューの

  • 新しいプロジェクト
  • プロジェクトのインポート

から登録を行います。登録方法については、前回の記事を参照してください。

アプリ設定を行う

Monaca Localkitへプロジェクトの登録が完了したら、アプリ設定を行います。アプリ設定を行う場合は、設定ボタンをクリックします。設定は、Monacaクラウド上で行うため、設定ボタンをクリックすると、リモート設定画面が表示されます。

左のメニューにあるアプリ設定項目から、必要な設定を行います。このアプリ設定は、後から設定しても問題ありません。設定が完了したら保存ボタンをクリックします。

リモート設定画面を閉じると、ファイル同期に関するダイアログが表示されます。Monacaクラウドとローカルでファイル同期を行う場合は、はいをクリックします。選択した処理をデフォルトに設定したい場合は、この選択をデフォルトとして今後使用するにチェックを付けます。デフォルトの設定は、Monaca Localkitの設定画面から変更することが出来ます。

Cordovaプラグインの設定を行う

対象のMonacaプロジェクトでCordovaプラグインを使用する場合は、リモート設定画面の

  • プロジェクト - Cordovaプラグイン

から行います。Monacaで提供しているCordovaプラグインを使用する場合は、利用可能なプラグインから対象のCordovaプラグインを有効にします。

Monacaで提供していないCordovaプラグインを使用する場合は、Cordovaプラグインのインポートボタンからインポートを行います。Cordovaプラグインのインポートは、圧縮ファイルや、URL、npmパッケージ名からインポートすることが出来ます。

エディターでコーディングを行う

エディターを使用して実際の処理をコーディングしていきます。Monaca Localkitにエディターを登録している場合は、開くから選択することで、対象のエディターでMonacaプロジェクトを開くことが出来ます。

エディターの登録方法については、前回の記事を参照してください。

Monacaデバッガーを使用して動作確認を行う

Monaca Localkitに登録されているプロジェクトをMonacaデバッガーで動作確認する場合は、Monaca LocalkitとMonacaデバッガーをペアリングさせる必要があります。

通常、Monaca Localkitを起動した状態でMonacaデバッガーをMonaca LocalkitでログインしているMonacaアカウントでログインすると、ペアリングするためのダイアログボックスが表示されます。

ペアリングボタンをクリックすると、Monaca Localkitとペアリングします。ペアリングが成功すると、Monaca LocalkitのデバッガータブにペアリングしたMonacaデバッガーが表示されます。

Monaca Localkitの実行ボタンをクリックするかMonacaデバッガーのローカル プロジェクトに表示されているプロジェクトをタップすると、Monacaデバッガーでプロジェクトを実行する事ができます。

実行されたプロジェクトの動作確認を行い、動作に問題ないかチェックします。動作に問題がある場合は、以下の記事を参考にデバッグを行います。

デバッグビルドしたアプリで動作確認を行う。

Monacaデバッガーでの動作確認ができたら、デバッグビルドしたアプリで最終確認を行います。Monacaデバッガーは、デバッグツールのため、アプリの実行環境が、デバッグビルドしたアプリと全く同じではありません。そのため、最終的な動作確認は、デバッグビルドしたアプリで行う必要があります。

デバッグビルドしたアプリでの動作確認ができたら、リリースビルドを行い、公式ストアへの公開手続きを行います。

おわりに

2回にわたり、Monaca Localkitの基礎知識と活用について説明しました。Monaca Localkitを使用する事で、使い慣れたエディターを使用できたり、Monacaでは対応できないバージョン管理システムを利用できる等のメリットがあります。Monacaの利用環境にあわせて、MonacaクラウドIDEとMonaca Localkitを使い分けてみてください。