Monacaでアクアポニックスを監視するアプリを作ってみた

Toshio Kuga/ 7月 21, 2016/ アクアポニックス/ 0 comments

どうも、くがとしおです。

以前からiPhone・androidアプリの作成に興味がありましたが、重い腰が上がらない、上がらない。
本格的なアプリ作成の前に、簡単なアクアポニックスの監視アプリを作成してみました。
アプリ作成方法としては、無料化されて話題のXamarinにしようかなと思いましたが、グラフ描画が弱いとのこと。
今回は、ホームページの内容の一部をアプリ化するだけですので、HTML/CSS/Javascriptでアプリが
作成できるMonacaを選択しました。
スポンサードリンク

その前に・・・

知っておきたい知識を紹介しておきます。

Monaca

Monacaを使用すると、HTML5、CSS、JavascriptというWeb開発者のスキルセットでモバイルアプリの開発が始められます。
クラウド上に開発環境が整っており、ブラウザを使用してどこからでも開発を進めることが可能です。

Visual Studioなどの既存のローカル開発環境でも開発可能です。
僕は、クラウドの開発環境を使ってみました。

詳細は、こちらをご覧ください。

 

完成アプリ

実際に完成したアプリはこんな感じです。
3タブ構成のアプリとなります。各タブの内容は、ホームページの内容と同じです。

グラフタブ

 graph

野菜槽(GROW BED)

growbed

水槽(FISH TANK)

fishtank

 ソース

Githubにリポジトリを作成しました。
誰の参考になるかは分かりませんが。。。

「くがとしお」的 まとめ

ホームページの一部をアプリ化しただけですが、amChartsも使用することができて、いい感じ。
アプリ作成時間は、2時間程度でした。
サーバーを使用しなければいけないアプリを作る際には、mBaaSとMonacaの組み合わせは、よいと思います。

では!

 

 

Leave a Comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">
*
*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)