第1回 CORDOVA開発環境紹介

ハイブリッドアプリの開発を始める前に、まずは使用する開発環境に関して解説したいと思います。この環境を使えば、誰でもすぐに、アプリの作成を始めることができます。

 

開発環境

ハイブリッドアプリ開発フレームワーク CORDOVA


CORDOVA は、Adobe社により公開されている、スマートフォン向けハイブリッドアプリ作成フレームワークであるPhoneGap のオープンソース名です。

そもそもハイブリッドアプリとは、HTML5/JavaScriptを使用して実装されるクロスプラットフォーム対応のアプリであり、開発者にとっては以下のような利点があります。

  • Web開発の知識を利用してアプリを開発することが可能
  • Android/iOS向けのアプリを同時に開発することが可能

1つのソースコードでAndroidスマホ/iPhone両方のアプリが作れるなんて、なんだかお得な感じがしますよね。

 

ハイブリッドアプリ開発環境 Monaca


TONGARISMでは、CORDOVAの開発環境としてMonacaを使用することにしました。

Monacaとは、アシアル株式会社が提供しているクラウドベースのハイブリッドアプリ開発用プラットフォームです。

基本的なアプリ作成の機能であれば、誰でも無料で利用することができ、簡単なユーザー登録のみでハイブリッドアプリの開発を始めることができます。

また、EclipseやAndroidStudioのようなPCへのインストールではなく、Web経由にて開発を行うクラウドベースであるため、Webに接続できる環境であればどこからでも開発を行うことができます。

Monacaのユーザー登録は、公式サイトから行うことができます。

 

monaca開発環境

Monaca開発環境

 

さらにMonacaでは、手持ちのスマホ上で動作を確認できるデバッガアプリが提供されています。デバッガアプリは、AndroidのPlay StoreやiPhoneのApp Storeから無料で入手できます。

image

Monacaデバッガアプリ

 

さっそく試してみた

Monacaのユーザー登録と、デバッガアプリのインストールが済んだところで、さっそく簡単なコードを書いてみたいと思います。Monaca上で以下のようなスカイツリーの地図を表示するコードを作成し、スマホの画面上に表示させてみます。

サンプルコードスマホにインストールしたデバッガアプリから、コードを作成したものと同じアカウントでログインしてみると・・・

monaca

 

デフォルトであらかじめ用意されているHello Worldアプリと一緒に、新しく作成したプロジェクト名が表示されています。

作成したプロジェクト名を選択すると・・・

image

作成したコードの通り、画面上に地図が表示されました。

クラウド環境のお陰で、PCとスマホをケーブルでつないだりせずにデバッグを行うことができます。とっても便利ですね!!

また、Monaca上でコードを修正すると、デバッガに即時反映されるため、スマホ上での動きをリアルタイムに確認しながら開発を行うことができます。

 

 

次回は…

 次回は、ここで紹介した環境を使って、実際に経路探索アプリを作成していきます。

Leave a Reply

メールアドレスが公開されることはありません。