![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca.png)
Web上でハイブリッドアプリが作成出来る統合開発環境「Monaca」を使ってみる
Web上でハイブリッドアプリが作成出来る統合開発環境「Monaca」を使ってみました。
使用感などのご紹介。
以前書いた記事『Web系プログラマがスマートフォンアプリの作成に挑戦する方法』でご紹介させて頂きましたハイブリッドアプリをWeb上で作成することが可能な「Monaca」をご紹介させて頂きます。
ご紹介
HTML5を使用して様々なプラットフォームのアプリを作成することが可能です。![マルチプラットフォーム](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_001.png)
Web上で作成したコードをすぐに実機でテストすることが可能。
![テスト](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_002.png)
MonacaでHTML5でコーディングを行うことが出来、テストもすぐに実機ですることが可能です。
オンラインでビルド、ストアへの提出も楽に出来ます。(私はストアはまだ未体験です)
![開発フロー](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_003.png)
料金は様々なプランがありますが、制限は無料で使用することも出来ます。(私は現在、無料です。)
料金ページはこちら
![料金](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_004.png)
実際に使用してみて
登録は下図のサイト右上サインアップから登録を行います。Monaca
![Monacaトップ](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_005.png)
登録を完了してログインするとすぐに開発が行えます。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_006.png)
プロジェクト作成ボタンを押すと基本のプロジェクトの選択を行います。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_007.png)
今回は最初なのでHello Worldアプリを選択します。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_008.png)
Hello Worldアプリがプロジェクトとして登録されました。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_009.png)
Hello Worldアプリを開くと開発画面になります。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_010.png)
デバックの仕方
開発画面の上のデバッグを選択してAndoroidを選択します。(私がAndroidなのですいません)![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_011.png)
そうするとデバック用にGooglePlayからMonacoデバッカーをダウンロードするように促されます。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_012.png)
Monacaのログイン情報でデバッカーにログインを行い、Monacaのプロジェクトと同期を行います。
Hello Worldアプリを実行します。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_013.png)
Hello Worldアプリの実行画面です。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_014.png)
Start Demoを押下するとデモが始まります。
項目ごとに実行が様々な機能が実行されます。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_015.png)
右下の「□」のアイコンを押すとデバック用の各種データの閲覧も可能です。
![](http://scrap.php.xdomain.jp/wp-content/uploads/monaca/monaca_016.png)
以上、簡単ですがこんなものになります。
今後はハイブリッドアプリのネタやMonacaで自作アプリの制作などをやっていこうかと思っております。
«前の記事:初心者向け簡単プログラミングレシピ投稿サイト『コードレシピ』の紹介Linuxで定期的にプログラムを実行できるcronの使い方:次の記事»