ニフクラ mobile backend(mBaaS)お役立ちブログ

スマホアプリ開発にニフクラ mobile backend(mBaaS)。アプリ開発に役立つ情報をおとどけ!

FirefoxOS × mBaaSハンズオンレポート!

7月24日(金)にFirefoxOS × NCMBと題してFirefoxOSアプリを開発するハンズオンを行いました。

今回はそのハンズオンの中から登壇いただいたMozilla 清水さんの講演内容と、ハンズオンに参加された方からの感想を紹介したいと思います。

FirefoxOS について(Mozilla 清水さん)

なぜMozzilaがOSをやっているのかというと、私たちは「ユーザーが選択できるということが大事」だと考えている組織だからです。昔、WebブラウザはInternet Explorerしかありませんでした。そこに新しいOSが出てきたことでユーザーが選択できるようになり、競争が生まれたという歴史がありました。

Webブラウザと同じように、スマートフォンOSにもユーザーが選択できるようにしたいと考えました。現在の2大OS(iOS、Android)の他に選択肢を与えたい。そして、彼らとは違うポリシー、違うデザインで作ることを大事にしています。私たちはFirefoxOSがスマートフォンを設計するとどうなるかと考えて作っています。FirefoxOSは様々なところに広がっています。デバイスの管理ができて、HTML5でアプリケーションが書けるのはすごく魅力的に見えるようです。

昔のHTMLとは違い、今のHTML5は一種の画面描画言語になっています。画面描画ができることで、テレビなどにも普及が進んでいます。パナソニックのビエラの最新機種にはFirefoxOSが入っていて、メニューを見るとブラウザとありますが、アイコンがFirefoxです。UIなどもHTML5で書かれています。こうしてスマートフォン以外にも進出してきています。

その他に組込みボードのCHIRIMENを開発しています。モーターやLEDの制御などもJavaScriptで行っています。現在プロトタイピングが終わった段階で、そのうちKickstaterに出て買えるようになります。

スマートフォンから始まって、テレビや組込みボードなど様々なデバイスに広がっていますが、基本的な構造は一緒で、アーキテクチャは3層からなっています。一番下はAndroid由来のLinuxとなっています。Unixに詳しい人ならわかるかと思いますが、init.dが走ります。その上でGeckoが実行される仕組みです。GeckoはFirefoxのUIを除いたもの(エンジン部分のみ)です。

FirefoxOSの仕組みはブラウザを全画面表示してそこにアプリを起動してHTML5をロードしています。アプリケーションの切り替えはタブで切り替えています。FirefoxOSアプリの特徴は全部HTML5とJavaScriptで書けることです。通常のアプリは実機に入れる際にビルドが必要になりますが、FirefoxOSでは不要です。さらに類似の技術としてPhoneGap/Cordovaが知られていますが、あちらではラッピングする分コンパイルが必要ですがFirefoxOSアプリでは全く不要になります。

iPhoneとAndroidとの決定的な考え方の違いは僕たちはブラウザメーカなのでブラウザでできることを増やせる、ブラウザを拡張して電話をかけたり、カメラで写真を撮る機能を追加することができるといった点にあると言えます。

FirefoxOSアプリは基本的なHTMLとCSSとJavaScriptに マニフェスト を足しています。マニフェストはアプリケーションのメタデータでインストールする際のアイコンなどのデータが書いてあるJSONファイルです。HTMLアプリにJSONファイルを足すとFirefoxOSアプリになります。アプリケーション開発は敷居が高くみえますが、WebサイトにJSONファイル1個足すとアプリになりますというとすごく気が楽になります。JavaScriptが全く書けなくても、簡単なアプリならマニフェストを足せばできます。

FirefoxOSの開発を始めるために必要なものはFirefoxだけです。開発者登録やSDKのダウンロードは不要です。標準のFirefoxまたは、Firefox Developer Editionがあり、最新のデバッグやエディタ機能が使えます。自分の好きなエディタ、自分の好きな環境を使って開発ができます。シミュレータはアドオンの追加機能で用意されています。

アプリには内部、特権、通常の3種類の権限があります。内部はキャリアなどしか使えませんので、通常の開発者は特権、通常のいずれかを使うことになります。まずは通常権限で使っていただいて、使いたい機能によって特権を使うと良いと思います。権限の違いはセキュリティなどもあるのですが、一番大きな違いはできることの違いです。

完成したアプリはFirefox Marketplaceで公開できます。アップルのApp StoreやAndroidのGoogle Playのようなものです。通常権限は早ければ3、4時間でレビューされます。特権は2週間から3週間、長くて1ヶ月程度掛かります。

参加した感想

今回のハンズオンではカメラアプリを作りました。アプリでカメラを撮影し、撮影した写真を並べる機能とそれについて他の人がコメントできる機能があるものです。

私はWebデザインやHTMLコーディングの経験はありますが、プログラマの業務経験はありません。しかし、HTML/Javascriptが用意されている状態だったので、スムーズに行えました。可能であれば、自分でコーディングしたかったのですが、用意されたものをコピー&ペーストすることで行いました。時間の関係で途中で終わってしまったのですが、最後に完成したソースをインポートして、完成したアプリを操作してみました。HTML/CSS/Javascriptが理解できる人なら本当に簡単にできてしまうので、自分でも今度挑戦したいと思いました。

FirefoxOS端末Fx0 LGL25は、今回のハンズオンではじめて触ったのですが、思わず欲しくなりました。価格と比較して驚くほど高級感のある端末です。ハンズオンの合間に価格を検索していたくらいです。

今回のハンズオン参加者はプログラマの方がほとんどだったようですが、FirefoxOSではプログラマだけでなく、Webデザイナーやフロントエンドエンジニアの人でも簡単にアプリが作れるので、ぜひ挑戦して欲しいと思います。


今回のハンズオンの内容はQiitaにて記事化してあります。

こちらの内容に沿って進めてもらっても自分でFirefoxOSアプリを作ることができます。ぜひチャレンジしてみてください!